Kaedah JS untuk mengosongkan kandungan kotak teks dan mencetuskan js apabila kotak teks dipulihkan dan tetikus meninggalkan kemahiran kotak teks

Kaedah JS untuk mengosongkan kandungan kotak teks dan mencetuskan js apabila kotak teks dipulihkan dan tetikus meninggalkan kemahiran kotak teks_javascript

WBOY

Lepaskan： 2016-05-16 15:20:42

asal

1431 orang telah melayarinya

Kotak teks yang perlu diisi pada berbilang tapak web akan memberikan bahasa gesaan lalai secara lalai Apabila tetikus mengklik pada kotak teks ini, teks lalai di dalam boleh dikosongkan apabila teks yang dimasukkan dipadamkan dan fokus meninggalkan kotak teks Kemudian tulis teks lalai ke dalam kotak teks.

Kod adalah seperti berikut:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>点击文本框清除默认值</title>
<script type="text/javascript"> 
window.onload=function()
{
var username=document.getElementById("username");
username.onclick=function()
{
if(username.value=="请输入您的姓名")
{
username.value="";
this.focus();
}
}
username.onblur=function()
{
if(username.value=="")
{
username.value="请输入您的姓名";
}
}
}
</script>
</head>
<body>
<input type="text" value="请输入您的姓名" id="username" />
</body>
</html>

Salin selepas log masuk

Kod di atas menyedari keperluan kami Apabila kotak teks diklik, kandungan dalam kotak teks boleh dikosongkan Jika tiada kandungan dimasukkan dalam kotak teks, apabila fokus tetikus meninggalkan kotak teks pada masa ini nilai kotak teks akan dipulihkan kepada keadaan lalai. Walau bagaimanapun, jika kotak kata laluan agak menyusahkan kerana kotak kata laluan tidak dipaparkan dalam teks yang jelas, penyelesaiannya boleh didapati dalam pelaksanaan JavaScript bagi gesaan apabila kotak input (kotak kata laluan) muncul.

Cara mencetuskan js apabila tetikus meninggalkan kotak teks

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="textBox.WebForm1" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script type="text/javascript"> 
function validate() { 
var name = document.getElementById("txtName"); 
if (name.value == 2) { 
alert("你必须不是二!"); 
name.focus(); 
return false; 
} 
return true; 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<asp:TextBox ID="txtName" onblur="validate();" runat="server" /> 
</div> 
</form> 
</body> 
</html>

Salin selepas log masuk