jQuery:delegate中select()不起作用的解決方法(實(shí)例講解)
jQuery有一個(gè)很好用的delegate(事件委派)功能,可以給當(dāng)前以及將來(lái)(動(dòng)態(tài)添加)的元素綁定一個(gè)事件處理函數(shù)。
比如下面的例子,動(dòng)態(tài)添加一個(gè)輸入文本框后,我想讓所有文本框(不管是不是動(dòng)態(tài)添加的)在獲取焦點(diǎn)時(shí),自動(dòng)轉(zhuǎn)大寫(xiě)。
<!doctype html>
<html>
<head>
<title>delegate測(cè)試</title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.js"></script>
<style type="text/css">
*{padding:0;margin:0;list-style:none;margin:5px}
</style>
<script type="text/javascript">
//動(dòng)態(tài)添加一行文本輸入框
function addInput(){
$("#ulTarget").append("<li><input type=\"text\" value=\"aaaaaa\"/></li>");
}
$().ready(function(){
$("#ulTarget").delegate(":text","focus",function(){
$(this).val($(this).val().toUpperCase());
});
})
</script>
</head>
<body>
<ul id="ulTarget">
<li><input type="text" value="123456abc"/></li>
<li><input type="text" value="123456abc"/></li>
<li><input type="text" value="123456abc"/></li>
<li><input type="text" value="123456abc"/></li>
</ul>
<button id="btnAdd" onclick="addInput()">add input</button>
</body>
</html>
接下來(lái),我還想加點(diǎn)小功能,在獲取焦點(diǎn)時(shí),還要讓文本框自動(dòng)全選。
$().ready(function(){
$("#ulTarget").delegate(":text","focus",function(){
$(this).val($(this).val().toUpperCase()).select();
});
})
但是實(shí)際測(cè)下來(lái),.select()死活就是不起作用,無(wú)奈請(qǐng)出setTimeout
$().ready(function(){
$("#ulTarget").delegate(":text","focus",function(){
var jqObj = $(this);
jqObj.val(jqObj.val().toUpperCase());
setTimeout(function(){jqObj.select();},100);
});
})
解決了.
- 解決jQuery ajax請(qǐng)求在IE6中莫名中斷的問(wèn)題
- jQuery解決IE6、7、8不能使用 JSON.stringify 函數(shù)的問(wèn)題
- jquery fancybox ie6不顯示關(guān)閉按鈕的解決辦法
- jquery submit ie6下失效的原因分析及解決方法
- 解決jquery的.animate()函數(shù)在IE6下的問(wèn)題
- 關(guān)于jquery中動(dòng)態(tài)增加select,事件無(wú)效的快速解決方法
- jquery html動(dòng)態(tài)生成select標(biāo)簽出問(wèn)題的解決方法
- jQuery選中select控件 無(wú)法設(shè)置selected的解決方法
- jQuery 跨域訪問(wèn)問(wèn)題解決方法
- jquery的ajax()函數(shù)傳值中文亂碼解決方法介紹
- jQuery在ie6下無(wú)法設(shè)置select選中的解決方法詳解
相關(guān)文章
jQuery實(shí)現(xiàn)簡(jiǎn)單復(fù)制json對(duì)象和json對(duì)象集合操作示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單復(fù)制json對(duì)象和json對(duì)象集合操作,結(jié)合實(shí)例形式分析了jQuery使用extend方法操作json對(duì)象與json對(duì)象集合復(fù)制相關(guān)技巧,需要的朋友可以參考下2018-07-07多功能jQuery樹(shù)插件zTree實(shí)現(xiàn)權(quán)限列表簡(jiǎn)單實(shí)例
這篇文章主要介紹了多功能jQuery樹(shù)插件zTree實(shí)現(xiàn)權(quán)限列表簡(jiǎn)單實(shí)例,優(yōu)異的性能、靈活的配置、多種功能的組合,是樹(shù)插件zTree最大的優(yōu)勢(shì),感興趣的小伙伴們可以參考一下2016-07-07jQuery實(shí)現(xiàn)表格行數(shù)據(jù)滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)表格行數(shù)據(jù)滾動(dòng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-08-08JQuery手速測(cè)試小游戲?qū)崿F(xiàn)思路詳解
這篇文章主要介紹了JQuery手速測(cè)試小游戲?qū)崿F(xiàn)思路詳解,本文給大家介紹的非常詳細(xì),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09jQuery實(shí)現(xiàn)導(dǎo)航欄頭部菜單項(xiàng)點(diǎn)擊后變換顏色的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)導(dǎo)航欄頭部菜單項(xiàng)點(diǎn)擊后變換顏色的方法,涉及jQuery響應(yīng)鼠標(biāo)事件針對(duì)頁(yè)面元素的遍歷及屬性變換相關(guān)操作技巧,需要的朋友可以參考下2017-07-07jquery統(tǒng)計(jì)用戶選中的復(fù)選框的個(gè)數(shù)
使用選擇器得到所有被勾選的復(fù)選框元素的集合,然后通過(guò)判斷元素的個(gè)數(shù)來(lái)得到用戶勾選的個(gè)數(shù),需要的朋友可以參考下2014-06-06jQuery+.net實(shí)現(xiàn)瀏覽更多內(nèi)容(改編php版本)
改編自php版本這里記錄.net 下的實(shí)現(xiàn);首先創(chuàng)建數(shù)據(jù)庫(kù)表test,并插入一些測(cè)試數(shù)據(jù)接下來(lái)建立一個(gè)html文件,感興趣的朋友可以參考下哈,希望您可以幫助到你2013-03-03