jQuery 触发元素的事件

jQuery trigger an element's event

本文关键字：事件 元素 jQuery      更新时间：2023-09-26

我的问题和这个一样

我也遇到了同样的问题，href没有为事件"点击"触发.然后我改为alt，元素span.这是我的代码 

<li><h2><span id='aa' alt="#inbox"><span>Inbox</span></span></h2></li>

这条线是我ul的第二个孩子。我想在加载页面时触发/单击此行。

但是我想知道如何触发此跨度（#aa）单击事件。尝试以下代码，但不起作用。
第一次尝试：

var href = $('#aa').attr('alt');
      window.location.href =href; // this gave me 404 error

第二次尝试：

 $('#aa').trigger("click")   // this has no change

单击上述 li>span 时将执行编辑函数。我希望在页面加载时自动单击li的跨度。这个问题的答案说了使用<a href>时的一些问题。因此，我改用span标签。 我使用 jQuery 1.6

您的第一次尝试给了您 404，因为您尝试将 URL 更改为 #inbox 。我假设您实际上想将哈希附加到当前 URL，在这种情况下，您可以使用 location.hash 属性：

window.location.hash = href;

我认为您可能还想使用 a 元素而不是 span ，因为这样默认情况下它会有这种行为，您不必绑定点击事件来处理它。

编辑 ：您指向的另一件事是 url 适用于A标签而不是Span标签，Jquery 如何在 href 元素上触发点击事件，这是针对您在问题中提到的标签。

如果您正在触发点击事件，则存在问题，则应将点击事件与 span 绑定，而不是使用触发函数来触发它

写入点击事件

$('#aa').click( function() 
    {
             alert('span clicked');
   });

触发事件比

$('#aa').trigger("click");

如果我理解正确，这将解决您的问题;

像这样提供可点击的跨度。

$('#aa')
        .bind('click', function () { 
               .....
});

并在 document.ready 中这样称呼它

$('#Control_2').click();

我认为最简单的解决方案是将您的跨度更改为锚标签以处理加载后的任何点击，如果您只想将哈希标签添加到当前 url。然后，您只需使用一些jquery来选择页面加载时所需的链接即可。

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
    $(function() {
        window.location.hash = $('#second').attr('href');
    });
    </script>
</head>
<body>
    <ul>
        <li><a href="#first">First</a></li>
        <li><a href="#second" id="second">Second</a></li>
    </ul>
</body>
</html>

如果这不是您想要的，并且您想在单击时运行更多代码，那么您可以将单击逻辑分离到一个函数中，并在页面加载时调用它，如下所示：

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
    $(function() {
        //your function that does stuff on click
        function doStuff(item) {
            window.location.hash = $(item).attr('href');
            //cancel the click
            return false;
        }
        //call the function on page load
        doStuff($('#second'));
        //call the function on click
        $('#nav a').click(function() { doStuff(this); });
    });
    </script>
</head>
<body>
    <ul id="nav">
        <li><a href="#first">First</a></li>
        <li><a href="#second" id="second">Second</a></li>
    </ul>
</body>
</html>
相关文章：