當鼠標聚焦到郵箱地址文本框時，文本框內的“請輸入郵箱地址”文字被清空。
效果圖：
複製代碼代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="類似於yahoo郵箱登陸的提示效果.aspx.cs" Inherits="類似於yahoo郵箱登陸的提示效果" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type ="text/javascript" src ="Scripts/jquery-1.7.1.js"></script>
<script type ="text/javascript" >
$(function () {
//對地址框進行操作
$("#address").focus(function () { //地址框獲得鼠標焦點
var txt_value = $(this).val(); //得到當前文本框的值
if (txt_value == "請輸入郵箱地址") {
$(this).val(""); //如果符合條件，則清空文本框內容
}
});
$("#address").blur(function () { //地址框失去鼠標焦點
var txt_value = $(this).val(); //得到當前文本框的值
if (txt_value == "") {
$(this).val("請輸入郵箱地址"); //如果符合條件，則設置內容
}
})
//對密碼框進行操作
$("#password").focus(function () {
var txt_value = $(this).val();
if (txt_value == "請輸入郵箱密碼") {
$(this).val("");
}
});
$("#password").blur(function () {
var txt_value = $(this).val();
if (txt_value == "") {
$(this).val("請輸入郵箱密碼");
}
})
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type ="text" id ="address" value ="請輸入郵箱地址" /><br /><br />
<input type ="text" id ="password" value ="請輸入郵箱密碼" /><br /><br />
<input type ="button" value ="登錄" />
</div>
</form>
</body>
</html>