如何使用jQuery触发点击链接
我有一个链接:
<ul id="titleee" class="gallery"> <li> <a href="#inline" rel="prettyPhoto">Talent</a> </li> </ul>
我试图用下面的方法来触发它:
$(document).ready(function() { $('#titleee').find('a').trigger('click'); });
但它不起作用。
我也试过: $('#titleee a').trigger('click');
编辑 :
我实际上需要触发这里所说的<a href="#inline" rel="prettyPhoto">
如果你试图触发锚点上的事件,那么你的代码将工作我重新在jsfiddle中添加一个eventHandler你的例子,所以你可以看到它的工作原理:
$(document).on("click", "a", function(){ $(this).text("It works!"); }); $(document).ready(function(){ $("a").trigger("click"); });
你是否试图让用户通过点击锚点导航到网页上的某个点,或者你是否试图触发绑定到它的事件? 也许你没有实际上将点击事件绑定到事件?
另外这个:
$('#titleee').find('a').trigger('click');
相当于这个:
$('#titleee a').trigger('click');
无需调用查找。 🙂
对不起,但事件处理程序是真的不需要。 你需要的是标签内的另一个元素点击。
<a id="test1" href="javascript:alert('test1')">TEST1</a> <a id="test2" href="javascript:alert('test2')"><span>TEST2</span></a>
jQuery的:
$('#test1').trigger('click'); // Nothing $('#test2').find('span').trigger('click'); // Works $('#test2 span').trigger('click'); // Also Works
这就是你所点击的内容,而不是标签,而是标签中的东西。 不幸的是,裸露的文本似乎没有被JQuery识别,但它是由香草javascript:
document.getElementById('test1').click(); // Works!
或者通过访问jQuery对象作为一个数组
$('#test1')[0].click(); // Works too!!!
随着你提供的代码,你不能指望发生任何事情。 我第二个@mashappslabs:首先添加一个事件处理程序:
$("selector").click(function() { console.log("element was clicked"); // or alert("click"); });
然后触发你的事件:
$("selector").click(); //or $("selector").trigger("click");
而且你应该在你的控制台中看到这个消息。
如果您试图触发锚点上的事件,那么您拥有的代码将起作用。
$(document).ready(function() { $('a#titleee').trigger('click'); });
要么
$(document).ready(function() { $('#titleee li a[href="#inline"]').click(); });
要么
$(document).ready(function() { $('ul#titleee li a[href="#inline"]').click(); });
那么你必须先设置点击事件,然后你可以触发它,看看会发生什么:
//good habits first let's cache our selector var $myLink = $('#titleee').find('a'); $myLink.click(function (evt) { evt.preventDefault(); alert($(this).attr('href')); }); // now the manual trigger $myLink.trigger('click');
这是演示如何触发事件
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(document).ready(function(){ $("input").select(function(){ $("input").after(" Text marked!"); }); $("button").click(function(){ $("input").trigger("select"); }); }); </script> </head> <body> <input type="text" value="Hello World"><br><br> <button>Trigger the select event for the input field</button> </body> </html>
这并不完全回答你的问题,但会让你头痛得less。
我总是有我的点击事件调用方法,其中包含所有我想要执行的逻辑。 所以我可以直接调用方法,如果我想执行没有实际点击的行动。
您应该调用元素的原生.click()方法或使用createEvent API。
有关更多信息,请访问: https : //learn.jquery.com/events/triggering-event-handlers/