jQuery setTimeout傳遞字符串參數(shù)報(bào)錯(cuò)的解決方法

更新時(shí)間：2014年06月09日 17:27:56 作者：

這篇文章主要介紹了jQuery setTimeout傳遞字符串參數(shù)報(bào)錯(cuò)的解決方法,需要的朋友可以參考下

當(dāng)你打算調(diào)用一些jQuery代碼顯示隱藏的一個(gè)元素,并調(diào)用setTimeout()在一段延時(shí)之后設(shè)置其HTML的內(nèi)容:

整個(gè)頁(yè)面的代碼是這樣的.

 
<span style="font-size:18px;"><html> 
<head> 
<title></title> 
</head> 
<body> 
<a href="#" id='heihei' onclick="showNext('I am veinei ')">show next</a> 
<a href="#" id="log" style="display:none" >yes,I am the next </a> 
<script type="text/javascript" src="jquery-1.10.2.min.js"></script> 
<script type="text/javascript"> 
function showNext(text){ 
setTimeout("$('#log').show().text(text)",1000); 
} 
</script> 
</body> 
</html> 
</span> 

.show()確實(shí)調(diào)用成功了.但是.text()調(diào)用失敗了.console顯示 text未定義.

對(duì)于這個(gè)問(wèn)題,我確實(shí)沒(méi)有找到更好的答案...我想是不是jQuery對(duì)這個(gè)傳入setTimeout()函數(shù)的內(nèi)容做了修改導(dǎo)致變量失效.

我緊接著做了下一個(gè)實(shí)驗(yàn).

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

 
<span style="font-size:18px;"><html> 
<head> 
<title></title> 
</head> 
<body> 
<a href="#" id='heihei' onclick="showNext('I am veinei ')">show next</a> 
<a href="#" id="log" style="display:none" >yes,I am the next </a> 
<script type="text/javascript" src="jquery-1.10.2.min.js"></script> 
<script type="text/javascript"> 
function showNext(text){ 
setTimeout("alert(text)",1000); 
} 
</script> 
</body> 
</html> 
</span> 

我要看看是不是確實(shí)是jQuery出了問(wèn)題.得到的是同樣的錯(cuò)誤.

后來(lái)找了本書看了看.發(fā)現(xiàn)了問(wèn)題的所在.

setTimeout() 接受一個(gè)字符串參數(shù)時(shí),它執(zhí)行于全局作用域,也就是說(shuō),它位于任何函數(shù)之外.最簡(jiǎn)單的修復(fù)手段就是使用一個(gè)局部函數(shù)(匿名函數(shù))來(lái)解決這個(gè)問(wèn)題.

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

 
<span style="font-size:18px;"><html> 
<head> 
<title></title> 
</head> 
<body> 
<a href="#" id='heihei' onclick="showNext('I am veinei ')">show next</a> 
<a href="#" id="log" style="display:none" >yes,I am the next </a> 
<script type="text/javascript" src="jquery-1.10.2.min.js"></script> 
<script type="text/javascript"> 
function showNext(text){ 
setTimeout(function(){$('#log').show().text(text);},1000); 
} 
</script> 
</body> 
</html> 
</span> 

成功解決這個(gè)問(wèn)題.

您可能感興趣的文章:

相關(guān)文章

深入理解JQuery循環(huán)綁定事件
下面小編就為大家?guī)?lái)一篇深入理解JQuery循環(huán)綁定事件。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-06-06
JQuery文字列表向上滾動(dòng)的代碼
JQuery實(shí)現(xiàn)的文字列表一條一條向上滾動(dòng)的效果
2013-11-11
jquery實(shí)現(xiàn)通用版鼠標(biāo)經(jīng)過(guò)淡入淡出效果
這篇文章主要介紹了jquery實(shí)現(xiàn)的通用版鼠標(biāo)經(jīng)過(guò)淡入淡出效果,需要的朋友可以參考下
2014-06-06
jquery聚焦文本框與擴(kuò)展文本框聚焦方法
在不同的瀏覽器中，一個(gè)文本框，如果只是直接給文本框設(shè)置focus()，那么光標(biāo)聚焦的位置可能是在最前面。下面的代碼則是給jquery擴(kuò)展一個(gè)textFocus方法
2012-10-10
jquery.boxy彈出框(后隔N秒后自動(dòng)隱藏/自動(dòng)跳轉(zhuǎn))
對(duì)于 Boxy彈出框的使用之前寫過(guò)一些文章（查看jquery.boxy基礎(chǔ)），今天主要是在解決一個(gè)需要之后，覺(jué)得值得把它記錄下來(lái)，所以就再寫一篇，主要功能是，在彈出對(duì)話框后，隔N秒后自動(dòng)隱藏，還有就是自動(dòng)跳轉(zhuǎn)
2013-01-01
jQuery DOM操作基于命令改變頁(yè)面
每天都在與DOM打交道而且暈頭轉(zhuǎn)向，不過(guò)，自打咱認(rèn)識(shí)了jQuery：是操作屬性也不煩了，插入新元素也不暈了，連移動(dòng)元素及包裝元素咱也不抽筋了。。
2010-01-01
小試JQuery的AutoComplete插件
在項(xiàng)目制作中，有時(shí)候需要向用戶提供一定的幫助信息來(lái)提示用戶的操作，當(dāng)然，suggest功能是必不可少的，但是自己開發(fā)的話，是比較費(fèi)時(shí)費(fèi)事的，這里就直接拿JQuery的autocomplete來(lái)用吧，實(shí)驗(yàn)證明，效果很好
2011-05-05
基于jQuery實(shí)現(xiàn)美觀且實(shí)用的倒計(jì)時(shí)實(shí)例代碼
倒計(jì)時(shí)效果在我們的日常生活中經(jīng)常會(huì)用到，比如說(shuō)高考倒計(jì)時(shí)、元旦放假倒計(jì)時(shí)、春節(jié)放假倒計(jì)時(shí)等等，下面通過(guò)本篇文章給大家分享基于jQuery實(shí)現(xiàn)美觀且實(shí)用的倒計(jì)時(shí)實(shí)例代碼，對(duì)jquery倒計(jì)時(shí)相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧
2015-12-12
jQuery僅用3行代碼實(shí)現(xiàn)的顯示與隱藏功能完整實(shí)例
這篇文章主要介紹了jQuery僅用3行代碼實(shí)現(xiàn)的顯示與隱藏功能,以完整實(shí)例形式分析了jQuery實(shí)現(xiàn)鼠標(biāo)響應(yīng)及頁(yè)面元素屬性變換的相關(guān)技巧,需要的朋友可以參考下
2015-10-10
基于jQuey實(shí)現(xiàn)鼠標(biāo)滑過(guò)變色(整行變色)
相信大家在一些網(wǎng)站都看到過(guò)這種效果吧，當(dāng)鼠標(biāo)放在新聞列表一行的時(shí)候，整行就會(huì)變色，雖然使用CSS也能夠?qū)崿F(xiàn)此種功能，但是由于眾多瀏覽器版本對(duì)于CSS3并沒(méi)有良好的支持，所以在當(dāng)前情況下，使用jQuery實(shí)現(xiàn)此種功能是一個(gè)不錯(cuò)的選擇
2015-12-12