jQuery中$.click()無(wú)效問(wèn)題分析
今天做表格前臺(tái)導(dǎo)出到xls時(shí),想自動(dòng)觸發(fā)a的點(diǎn)擊。但失敗。最后找到這個(gè)文件。
我嘗試過(guò)多次用jQuery模擬用戶點(diǎn)擊a標(biāo)簽的功能,但都沒(méi)有成功,并且困擾了很久。前段時(shí)間的一次發(fā)呆,冒出了新的想法,于是就動(dòng)手進(jìn)行了測(cè)試。
先看下邊的代碼:
<html>
<head>磨途歌-A標(biāo)簽測(cè)試1<head>
<body>
<a href=" </body>
</html>
<script src=">
<script>
jQuery(function($) {
//給所有A標(biāo)簽綁定點(diǎn)擊觸發(fā)事件
$('a').click(function() {
alert(1);
});
//觸發(fā)所有A標(biāo)簽的點(diǎn)擊事件
$('a').click();
});
</script>
上邊的代碼確實(shí)已經(jīng)觸發(fā)了點(diǎn)擊A標(biāo)簽事件,但大家一定也會(huì)有疑問(wèn),為什么點(diǎn)擊了A標(biāo)簽,卻不觸發(fā)A標(biāo)簽的跳轉(zhuǎn)事件?
一開(kāi)始還以為是瀏覽器做了相應(yīng)的安全措施,屏蔽了JS對(duì)A標(biāo)簽的操作,后來(lái)發(fā)現(xiàn),并不是這樣的,接下來(lái)就說(shuō)說(shuō)其中的原委。
在開(kāi)始解釋前,我先拋出一個(gè)問(wèn)題。在我們點(diǎn)擊“A標(biāo)簽”的時(shí)候,究竟是點(diǎn)擊了什么才發(fā)生的跳轉(zhuǎn)?
1)點(diǎn)擊的是“A標(biāo)簽”本身?
2)點(diǎn)擊的是“A標(biāo)簽”中顯示的文字?
說(shuō)到這里,大家應(yīng)該明白了,我們上邊的代碼已經(jīng)證實(shí)了點(diǎn)擊A標(biāo)簽本身,并不會(huì)觸發(fā)跳轉(zhuǎn)到指定鏈接的事件,就是說(shuō),我們平時(shí)都是點(diǎn)擊的A標(biāo)簽中的文字了?
既然有了頭緒,那么就來(lái)動(dòng)手試試。
<html>
<head>磨途歌-A標(biāo)簽測(cè)試2<head>
<body>
<a href=" </body>
</html>
<script src=">
<script>
jQuery(function($) {
var mo2g = '<span id="mo2g">磨延城<span>';
//給A標(biāo)簽中的文字添加一個(gè)能被jQuery捕獲的元素
$('a').append(mo2g);
//模擬點(diǎn)擊A標(biāo)簽中的文字
$('#mo2g').click();
});
</script>
這下效果出來(lái)了,事實(shí)證明了上述的推斷是正確的,所以要想用JS模擬點(diǎn)擊A標(biāo)簽事件,就得先往A標(biāo)簽中的文字添加能被JS捕獲的元素,然后再用JS模擬點(diǎn)擊該元素即可。
以上就是本文講訴的相關(guān)jQuery中$("a").click()無(wú)效問(wèn)題的分析了,希望小伙伴們能夠喜歡。
- jquery單選框radio綁定click事件實(shí)現(xiàn)方法
- jquery bind(click)傳參讓列表中每行綁定一個(gè)事件
- 使用jQuery的attr方法來(lái)修改onclick值
- jquery 為a標(biāo)簽綁定click事件示例代碼
- jquery trigger偽造a標(biāo)簽的click事件取代window.open方法
- JQuery給元素綁定click事件多次執(zhí)行的解決方法
- jQuery防止click雙擊多次提交及傳遞動(dòng)態(tài)函數(shù)或多參數(shù)
- jQuery focus和blur事件的應(yīng)用詳解
- jquery focus(fn),blur(fn)方法實(shí)例代碼
- jQuery解決input元素的blur事件和其他非表單元素的click事件沖突問(wèn)題
相關(guān)文章
jQuery下通過(guò)replace字符串替換實(shí)現(xiàn)大小圖片切換
實(shí)現(xiàn)的效果有點(diǎn)類(lèi)似于Google picasa相冊(cè)不同尺寸圖片的切換效果。本實(shí)例通過(guò)文字大?。╢ont-size)控制圖片尺寸的做法是跟Google學(xué)習(xí)的,但是jQuery代碼是根據(jù)效果自己想出來(lái)的,邏輯很簡(jiǎn)單,沒(méi)有什么精妙之處2012-05-05jquery實(shí)現(xiàn)簡(jiǎn)單的彈窗效果
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)簡(jiǎn)單的彈窗效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10jQuery動(dòng)態(tài)添加元素?zé)o法觸發(fā)綁定事件的解決方法分析
這篇文章主要介紹了jQuery動(dòng)態(tài)添加元素?zé)o法觸發(fā)綁定事件的解決方法,結(jié)合實(shí)例形式分析了動(dòng)態(tài)添加元素?zé)o法綁定事件的原因與相關(guān)解決方法,需要的朋友可以參考下2018-01-01基于jquery實(shí)現(xiàn)表格內(nèi)容篩選功能實(shí)例解析
對(duì)于表格來(lái)說(shuō),當(dāng)數(shù)據(jù)比較多的時(shí)候,我們無(wú)法一頁(yè)一頁(yè)的查找,這樣我們就可以進(jìn)行篩選操作,這篇文章主要為大家詳細(xì)介紹了基于jquery實(shí)現(xiàn)表格內(nèi)容篩選功能的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05jquery ajax局部加載方法詳解(實(shí)現(xiàn)代碼)
下面想就為大家?guī)?lái)一篇jquery ajax局部加載方法詳解(實(shí)現(xiàn)代碼)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧2016-05-05jquery中用函數(shù)來(lái)設(shè)置css樣式
本文主要對(duì)jquery中用函數(shù)來(lái)設(shè)置css樣式的方法進(jìn)行詳細(xì)介紹,具有很好的參考價(jià)值,下面就跟小編一起來(lái)看下吧2016-12-12jQuery模擬select實(shí)現(xiàn)下拉菜單功能
這篇文章主要介紹了jQuery模擬select實(shí)現(xiàn)下拉菜單功能,比較實(shí)用,需要的朋友可以參考下。2016-06-06jQuery實(shí)現(xiàn)圖片向左向右切換效果的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇jQuery實(shí)現(xiàn)圖片向左向右切換效果的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05