使用jquery給input和textarea設(shè)定ie中的focus
更新時(shí)間:2008年05月29日 19:43:56 作者:
在瀏覽網(wǎng)站的過程中,我們經(jīng)??梢钥匆姰?dāng)鼠標(biāo)點(diǎn)擊后樣式改變的文本框和文本域,那么這種效果是如何實(shí)現(xiàn)的呢?
今天在做我們的表單提交部分的時(shí)候,遇到了這個(gè)問題,于是,用傳說中的jquery就可以解決了.
這里主要說的是在IE下的focus的問題,因?yàn)樵趂irefox中是支持
input:focus
textarea:focus
在IE下:focus是無效的,所以,我們要在點(diǎn)擊以后給input和textarea加上新的樣式以配合實(shí)現(xiàn):focus效果.
我們首先來看下效果:
來看下這個(gè)效果中的JS:

<script language="javascript">
$(document).ready(
function(){if($.browser.msie){
$("input[@type='text'], input[@type='password'], textarea").focus(function() {$(this).css({background:"#FFFFF7"});})
$("input[@type='text'], input[@type='password'], textarea").blur(function() {$(this).css({background:"#fff"});})
}});
</script>
CSS這里這樣定義:
input,textarea{border: 1px solid #CCC;}
input:focus,textarea:focus{background:#FFFFF7;}
這是jquery的一個(gè)很簡單的應(yīng)用,我也是初學(xué),多多交流...
這里主要說的是在IE下的focus的問題,因?yàn)樵趂irefox中是支持
復(fù)制代碼 代碼如下:
input:focus
textarea:focus
在IE下:focus是無效的,所以,我們要在點(diǎn)擊以后給input和textarea加上新的樣式以配合實(shí)現(xiàn):focus效果.
我們首先來看下效果:
來看下這個(gè)效果中的JS:

<script language="javascript">
$(document).ready(
function(){if($.browser.msie){
$("input[@type='text'], input[@type='password'], textarea").focus(function() {$(this).css({background:"#FFFFF7"});})
$("input[@type='text'], input[@type='password'], textarea").blur(function() {$(this).css({background:"#fff"});})
}});
</script>
CSS這里這樣定義:
input,textarea{border: 1px solid #CCC;}
input:focus,textarea:focus{background:#FFFFF7;}
這是jquery的一個(gè)很簡單的應(yīng)用,我也是初學(xué),多多交流...
您可能感興趣的文章:
- jquery清空textarea等輸入框?qū)崿F(xiàn)代碼
- jQuery textarea的長度進(jìn)行驗(yàn)證
- JQuery為textarea添加maxlength屬性的代碼
- jquery實(shí)現(xiàn)textarea輸入框限制字?jǐn)?shù)的方法
- textarea中的手動換行處理的jquery代碼
- Jquery實(shí)現(xiàn)點(diǎn)擊按鈕,連續(xù)地向textarea中添加值的實(shí)例代碼
- jQuery替換textarea中換行的方法
- TextArea不支持maxlength的解決辦法(jquery)
- 基于jquery的textarea發(fā)布框限制文字字?jǐn)?shù)輸入(添加中文識別)
- jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法
相關(guān)文章
jQuery實(shí)例—選項(xiàng)卡的簡單實(shí)現(xiàn)(js源碼和jQuery)
下面小編就為大家?guī)硪黄猨Query實(shí)例—選項(xiàng)卡的簡單實(shí)現(xiàn)(js源碼和jQuery) 。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06Easyui 去除jquery-easui tab頁div自帶滾動條的方法
這篇文章主要介紹了Easyui 去除jquery-easui tab頁div自帶滾動條的方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-05-05jQuery EasyUI API 中文文檔 - Documentation 文檔
jQuery EasyUI API 中文文檔 - Documentation 文檔,使用jQuery EasyUI的朋友可以參考下。2011-09-09html+jQuery實(shí)現(xiàn)拖動滑塊圖片拼圖驗(yàn)證碼插件【移動端適用】
這篇文章主要介紹了html+jQuery實(shí)現(xiàn)拖動滑塊圖片拼圖驗(yàn)證碼插件,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-09-09jQuery+html5+css3實(shí)現(xiàn)圓角無刷新表單帶輸入驗(yàn)證功能代碼
這篇文章主要介紹了jQuery+html5+css3實(shí)現(xiàn)圓角無刷新表單帶輸入驗(yàn)證功能代碼,加入了html5與css3技術(shù),使得整個(gè)表單效果更加唯美華麗,需要的朋友可以參考下2015-08-08jQuery中Ajax全局事件引用方式及各個(gè)事件(全局/局部)執(zhí)行順序
這篇文章主要介紹了jQuery中Ajax全局事件引用方式及各個(gè)事件(全局/局部)執(zhí)行順序的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,感興趣的朋友一起學(xué)習(xí)吧2016-06-06