欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

基于jQuery的輸入框無(wú)值自動(dòng)顯示指定數(shù)據(jù)的實(shí)現(xiàn)代碼

 更新時(shí)間：2011年01月24日 00:03:15   作者：  
在自己的網(wǎng)頁(yè)中，常常要實(shí)現(xiàn)指定樣式的輸入框，當(dāng)輸入框中沒(méi)有輸入或只輸入空格等無(wú)效信息時(shí)，自動(dòng)顯示指定的文本，以提醒用戶應(yīng)該如何操作，下面是具體實(shí)現(xiàn)方法，僅供參考。
【解決方案】

　　1. 準(zhǔn)備工作

　?。?）輸入框
復(fù)制代碼 代碼如下:

<input type="text" name="searchText" title="請(qǐng)輸入搜索關(guān)鍵字" />

　?。?）CSS代碼
復(fù)制代碼 代碼如下:

input.helpText { color: #aaa;}

（3）轉(zhuǎn)換方法
復(fù)制代碼 代碼如下:

function switchText()
{
if ($(this).val() == $(this).attr('title'))
$(this).val('').removeClass('helpText');
else if ($.trim($(this).val()) == '')
$(this).addClass('helpText').val($(this).attr('title'));
}

（4）具體實(shí)現(xiàn)
復(fù)制代碼 代碼如下:

$('input[type=text][title!=""]').each(function() {
if ($.trim($(this).val()) == '') $(this).val($(this).attr('title'));
if ($(this).val() == $(this).attr('title')) $(this).addClass('helpText');
}).focus(switchText).blur(switchText);

$('form').submit(function() {
$(this).find('input[type=text][title!=""]').each(function() {
if ($(this).val() == $(this).attr('title')) $(this).val('');
});
});

2. 參考文章
http://webservices.blog.gustavus.edu/2008/06/23/text-input-example-text-with-jquery/

相關(guān)文章

  • 解析Jquery的LigerUI如何實(shí)現(xiàn)文件上傳

    解析Jquery的LigerUI如何實(shí)現(xiàn)文件上傳

    本篇文章是對(duì)Jquery中的LigerUI實(shí)現(xiàn)文件上傳的方法，進(jìn)行了分析介紹，需要的朋友可以參考下
    2013-07-07
  • 跟著JQuery API學(xué)Jquery 之四 css

    跟著JQuery API學(xué)Jquery 之四 css

    在javascript中我們常常要改變dom的css樣式 ，同樣Jquery也對(duì)改變css做了封裝不用我們?nèi)ビ?getElementByid().style.……來(lái)操作了
    2010-04-04
  • JQuery Ajax WebService傳遞參數(shù)的簡(jiǎn)單實(shí)例

    JQuery Ajax WebService傳遞參數(shù)的簡(jiǎn)單實(shí)例

    下面小編就為大家?guī)?lái)一篇JQuery Ajax WebService傳遞參數(shù)的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2016-11-11
  • jquery.cookie.js用法實(shí)例詳解

    jquery.cookie.js用法實(shí)例詳解

    這篇文章主要介紹了jquery.cookie.js用法,結(jié)合實(shí)例形式較為詳細(xì)的分析了jquery.cookie.js針對(duì)cookie的獲取、創(chuàng)建、設(shè)置、刪除等常用技巧,需要的朋友可以參考下
    2015-12-12
  • 基于jQuery實(shí)現(xiàn)文字打印動(dòng)態(tài)效果

    基于jQuery實(shí)現(xiàn)文字打印動(dòng)態(tài)效果

    這篇文章主要介紹了基于jQuery實(shí)現(xiàn)文字打印動(dòng)態(tài)效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2017-04-04
  • 通過(guò)jQuery源碼學(xué)習(xí)javascript(二)

    通過(guò)jQuery源碼學(xué)習(xí)javascript(二)

    昨天寫(xiě)了篇通過(guò)jQuery源碼學(xué)習(xí)javascript（一），里面有一個(gè)定義對(duì)象C的方法，我早期也沒(méi)有太注意這個(gè)方面的技術(shù)細(xì)節(jié)。后來(lái)我查了一下資料，發(fā)現(xiàn)里面有很多巧的地方。今天與大家分享
    2012-12-12
  • jQuery 開(kāi)天辟地入門篇一

    jQuery 開(kāi)天辟地入門篇一

    這篇jquery入門的文章，確實(shí)不錯(cuò)，前提是大家已經(jīng)對(duì)js稍微熟悉一點(diǎn)即可能看懂，非常不錯(cuò)的jquery入門篇文章。
    2009-12-12
  • jQuery制作簡(jiǎn)潔的圖片輪播效果

    jQuery制作簡(jiǎn)潔的圖片輪播效果

    這篇文章主要介紹了jQuery制作簡(jiǎn)潔的圖片輪播效果，代碼非常的精簡(jiǎn)，小伙伴們可以自己美化下，自由擴(kuò)展。
    2015-04-04
  • jquery鼠標(biāo)停止移動(dòng)事件

    jquery鼠標(biāo)停止移動(dòng)事件

    這篇文章主要介紹了jquery鼠標(biāo)停止移動(dòng)事件，有需要的朋友可以參考一下
    2013-12-12
  • JQuery限制復(fù)選框checkbox可選中個(gè)數(shù)的方法

    JQuery限制復(fù)選框checkbox可選中個(gè)數(shù)的方法

    這篇文章主要介紹了JQuery限制復(fù)選框checkbox可選中個(gè)數(shù)的方法,涉及jQuery操作復(fù)選框長(zhǎng)度判斷與屬性修改的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
    2015-04-04

最新評(píng)論