簡單的郵箱登陸的提示效果類似于yahoo郵箱
當(dāng)鼠標(biāo)聚焦到郵箱地址文本框時(shí)，文本框內(nèi)的“請輸入郵箱地址”文字被清空。
效果圖：
<%@ 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 () {
//對地址框進(jìn)行操作
$("#address").focus(function () { //地址框獲得鼠標(biāo)焦點(diǎn)
var txt_value = $(this).val(); //得到當(dāng)前文本框的值
if (txt_value == "請輸入郵箱地址") {
$(this).val(""); //如果符合條件，則清空文本框內(nèi)容
}
});
$("#address").blur(function () { //地址框失去鼠標(biāo)焦點(diǎn)
var txt_value = $(this).val(); //得到當(dāng)前文本框的值
if (txt_value == "") {
$(this).val("請輸入郵箱地址"); //如果符合條件，則設(shè)置內(nèi)容
}
})
//對密碼框進(jìn)行操作
$("#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>
相關(guān)文章
基于javascript實(shí)現(xiàn)右下角浮動(dòng)廣告效果
這篇文章主要介紹了基于javascript實(shí)現(xiàn)右下角浮動(dòng)廣告效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-01-01
本文主要介紹了js定時(shí)器不準(zhǔn)確問題的解決方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
兩種方法實(shí)現(xiàn)文本框輸入內(nèi)容提示消失
第一種方法:基于HTML5 input標(biāo)簽的新特性 - placeholder 。另外，x-webkit-speech 屬性可以實(shí)現(xiàn)語音輸入功能;第二種方法： 用span模擬，定位span，借助JS鍵盤事件判斷輸入，確定span里的內(nèi)容顯示隱藏2013-03-03
工作中比較實(shí)用的JavaScript驗(yàn)證和數(shù)據(jù)處理的干貨(經(jīng)典)
工作中比較實(shí)用的JavaScript驗(yàn)證和數(shù)據(jù)處理知識經(jīng)常會(huì)用到，下面小編通過查閱相關(guān)資料及日常記錄的知識分享到腳本之家平臺(tái)，供大家參考2016-08-08
JS判斷字符串變量是否含有某個(gè)字串的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄狫S判斷字符串變量是否含有某個(gè)字串的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
javascript實(shí)現(xiàn)tabs選項(xiàng)卡切換效果(擴(kuò)展版)
常用的頁面效果有彈出層效果，無縫滾動(dòng)效果，選項(xiàng)卡切換效果，接下來與大家分享一款自己用原生javascript寫的選項(xiàng)卡切換效果在原有的基礎(chǔ)上進(jìn)行了擴(kuò)展，加入了自動(dòng)輪播，這樣就變成了類似圖片輪播的效果2013-03-03
uniapp小程序點(diǎn)擊輸入框時(shí)阻止彈出軟鍵盤的幾種解決方案
在寫項(xiàng)目時(shí)候需要在表單里面加一個(gè)picker選擇器,但選擇input的時(shí)候軟鍵盤與選擇器會(huì)同時(shí)彈出,下面這篇文章主要給大家介紹了關(guān)于uniapp小程序點(diǎn)擊輸入框時(shí)阻止彈出軟鍵盤的幾種解決方案,需要的朋友可以參考下2024-02-02
利用JavaScript實(shí)現(xiàn)防抖節(jié)流函數(shù)的示例代碼
在開發(fā)中我們經(jīng)常會(huì)遇到一些高頻操作，比如：鼠標(biāo)移動(dòng)，滑動(dòng)窗口，鍵盤輸入等等，節(jié)流和防抖就是對此類事件進(jìn)行優(yōu)化，降低觸發(fā)的頻率，以達(dá)到提高性能的目的。本文就教大家如何實(shí)現(xiàn)一個(gè)讓面試官拍大腿的防抖節(jié)流函數(shù)，需要的可以參考一下2022-08-08
限制復(fù)選框最多選擇項(xiàng)的實(shí)現(xiàn)代碼
下面小編就為大家?guī)硪黄拗茝?fù)選框最多選擇項(xiàng)的實(shí)現(xiàn)代碼。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要介紹了CocosCreator新資源管理系統(tǒng)，從v2.4開始，Creator使用AssetBundle完全重構(gòu)了資源底層，提供了更加靈活強(qiáng)大的資源管理方式，也解決了之前版本資源管理的痛點(diǎn)（資源依賴與引用），本文將帶你深入了解Creator的新資源底層。2021-04-04