就是要做出這種預設文字的東西，然後焦點移到TextBox裡面，提示文字就會消失
不是每個人都會用jQuery，也不是每個人都有辦法弄到一堆元件
所以這篇是在最簡陋的環境把功能做出來
所以....提示文字不是淺灰色的就不要打我了，我還弄不出來嘛..
使用jQuery版本、參考網址、參考網址二
注意這次頭跟身體要一起copy喔
前台
<head runat="server">
<script language="javascript" type="text/javascript">
var state = 1;
function transfer1To2() {
if(state == 1) {
document.getElementById('textbox').value = "";
state = 2;
}
}
function transfer2To3() {
if(state == 2) {
state = 3;
}
}
function transfer2To1() {
if(state == 2) {
document.getElementById('textbox').value = "Enter something...";
state = 1;
}
}
function onfocusState() {
if(document.getElementById("mail").value=="請輸入E-Mail")
{
document.getElementById("mail").value=""
}
else if(document.getElementById("mail").value=="")
{
document.getElementById("mail").value="請輸入E-Mail"
}
else
{}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
在PageLoad時加載屬性(不會PostBack)
<br />
<asp:TextBox ID="TextBox1" runat="server" Text="Enter..."></asp:TextBox>
<br />
在Client端加載Javascript
<br />
<input name="textbox" id="textbox" type="text" value="Enter something..."
onMouseDown="transfer1To2();"
onFocus="transfer1To2();"
onChange="transfer2To3();"
onBlur="transfer2To1();">
<br />
<input type="text" name="mail" id="mail" runat="server" value="請輸入E-Mail" onfocus="onfocusState()" onblur="onfocusState()"/>
</div>
</form>
</body>
後台
protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Attributes["onfocus"] = "javascript:this.value='';";
}
沒有留言:
張貼留言