Question

我在ul中有一个li元素列表

<ul>
   <li><a href=#>ABC</a></li>
   <li><a href=#>DEF</a></li>
   <li><a href=#>GHI</a></li>
</ul>

我如何以编程方式单击li的第一个元素，并在该单击上调用JS函数。即我希望在页面加载时单击li元素

Answer 1

使用:first选择器选择第一个li，然后使用.trigger()为其触发点击事件。

$("ul li:first").trigger("click");

$("ul li:first").click(function(){
  console.log("First li clicked");
});
$("ul li:first").trigger("click");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
   <li><a href=#>ABC</a></li>
   <li><a href=#>DEF</a></li>
   <li><a href=#>GHI</a></li>
</ul>

Answer 2

尝试一下

function clickAlert(){
alert("I am called");
}

$('ul li:first').trigger('click',clickAlert());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
   <li><a href=#>ABC</a></li>
   <li><a href=#>DEF</a></li>
   <li><a href=#>GHI</a></li>
</ul>

Answer 3

jQuery具有声明事件处理程序并触发它们的方法。

使用<li>选择第一个$('ul li:first')元素

$('ul li:first').click(function() {
    // This will handle the click event
    // Put your JS function here.
});

$('ul li:first').click(); // This triggers the click event
$('ul li:first').trigger('click') // Will also trigger click event

如何使用javascript / jquery以编程方式单击第一个li元素？

3 个答案: