jQuery:delegate中select()不起作用的解決方法(實例講解)

更新時間：2014年01月26日 09:36:30 作者：

本篇文章只要是對jQuery:delegate中select()不起作用的解決方法進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助

jQuery有一個很好用的delegate(事件委派)功能，可以給當前以及將來(動態(tài)添加)的元素綁定一個事件處理函數(shù)。

比如下面的例子，動態(tài)添加一個輸入文本框后，我想讓所有文本框（不管是不是動態(tài)添加的）在獲取焦點時，自動轉(zhuǎn)大寫。

<!doctype html>
<html>
<head>
<title>delegate測試</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>

$().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>

接下來，我還想加點小功能，在獲取焦點時，還要讓文本框自動全選。

復(fù)制代碼代碼如下:

$().ready(function(){
 $("#ulTarget").delegate(":text","focus",function(){
$(this).val($(this).val().toUpperCase()).select();
 }); 
}) 

但是實際測下來，.select()死活就是不起作用，無奈請出setTimeout

復(fù)制代碼代碼如下:

$().ready(function(){
 $("#ulTarget").delegate(":text","focus",function(){
var jqObj = $(this);
jqObj.val(jqObj.val().toUpperCase());
setTimeout(function(){jqObj.select();},100);
 }); 
}) 

解決了.

您可能感興趣的文章:

相關(guān)文章

JQuery打造PHP的AJAX表單提交實例
本實例只利用到JQuery類庫本身的函數(shù)和功能，不需要第三方插件的支持。另外，所有表單信息都是利用PHPMailer類庫郵件的形式發(fā)送給管理員。
2009-11-11
jQuery實現(xiàn)平滑滾動頁面到指定錨點鏈接的方法
這篇文章主要介紹了jQuery實現(xiàn)平滑滾動頁面到指定錨點鏈接的方法,涉及jquery鼠標事件及頁面滾動的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-07-07
jQuery中:empty選擇器用法實例
這篇文章主要介紹了jQuery中:empty選擇器用法,實例分析了:empty選擇器的功能、定義及匹配空元素的用法技巧,具有一定的參考借鑒價值,需要的朋友可以參考下
2014-12-12
JQuery Study Notes 學(xué)習筆記(一)
jquery是當前比較流行的js類庫，學(xué)習它可以實現(xiàn)很多功能。
2010-08-08
Jquery亂碼的一次解決過程圖解教程
今天小朋友寫了個程式，出現(xiàn)亂碼，將解決過程分享一下為方便說明，將環(huán)境簡化，vs.net 2003, jquery-1.3.2.js, web service調(diào)用
2010-02-02
jQuery制作input提示內(nèi)容（兼容IE8以上）
這篇文章主要為大家詳細介紹了jQuery制作input提示內(nèi)容，兼容IE8以上，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-07-07
EasyUI創(chuàng)建對話框的兩種方式
對話框（Dialog）是一個特殊的窗口（window），可以包含在頂部的工具欄和在底部的按鈕。接下來通過本文給大家介紹easyui創(chuàng)建對話框的兩種方式，非常不錯，感興趣的朋友一起看下吧
2016-08-08
jquery實現(xiàn)簡單的二級導(dǎo)航下拉菜單效果
這篇文章主要介紹了jquery實現(xiàn)簡單的二級導(dǎo)航下拉菜單效果,涉及jquery鼠標事件動態(tài)操作頁面元素樣式及Ajax調(diào)用的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-09-09
jquery-syntax動態(tài)語法著色示例代碼
語法著色大家對它都不陌生吧，下面為大家介紹的是jquery-syntax動態(tài)語法著色的具體實現(xiàn),需要的朋友可以參考下
2014-05-05
jquery實現(xiàn)的橫向二級導(dǎo)航效果代碼
這篇文章主要介紹了jquery實現(xiàn)的橫向二級導(dǎo)航效果代碼,可實現(xiàn)鼠標滑過導(dǎo)航出現(xiàn)下拉菜單切換的效果,非常簡潔自然,涉及jquery鼠標hover事件及頁面元素樣式的動態(tài)改變技巧,需要的朋友可以參考下
2015-08-08