如何像一样触发div

Question

网站上有一个 div 框，并且有一个链接。我想单击容器以触发 ：

<a href="#">sapien sed</a>

但是当我单击容器 div 时，它没有给出响应或者处于无限循环中。 我该如何解决这个问题？ 也就是说；我想点击div触发

整个代码：

<div class="container">
    <h2>Lorem ipsum dolor sit amet</h2>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse congue molestie venenatis.
        In adipiscing vulputate sem. Suspendisse potenti. Vestibulum nisl nibh, interdum sit amet pulvinar at,
        malesuada vitae lacus. Aliquam semper <a href="#">sapien sed</a> risus laoreet ultrices. Donec volutpat felis eu justo
        bibendum tempus. Donec non purus sed sapien fringilla tempor ut et metus. Nulla ipsum nibh, dapibus
        ac ornare vitae, fermentum nec nulla.
    </p>
</div>

<script type="text/javascript">
    $(function(){
        $("div.container").each(function(){
            var $container = $(this);
            $container.find("a:first").each(function(){
                var $link = $(this);
                $container
                    .css("cursor", "pointer")
                    .click(function(e){
                        $link.trigger("click");
                        return false;
                    });
                $link.bind("click", function(e){
                    e.stopPropagation();
                    return true;
                });
            });
        });
    })
</script>

Answer 1

问题是您期望 trigger("click") 导致链接的默认行为发生（即您期望链接被跟踪并加载它链接到的页面）。然而，这不是 trigger 所做的。它所做的只是执行绑定到元素的 click 事件处理函数。

要实际点击该链接，您可以获取 href 并使用 window.location：

$link.bind("click", function(e){
   window.location = $link.attr("href");
   e.stopPropagation();
   return true;
});

这是一个 更新了小提琴。

Answer 2

要同时触发标准“href”链接和带有 onClick 事件的链接：

$(function() { 
    $("div.container").each(function(){
        var $container = $(this);
        $container.find("a:first").each(function(){
            var $this = $(this),
                onClick = this.onclick || null;
            $container
                .css("cursor", "pointer")
                .click(function(e){
                    $link.trigger("click");
                    return false;
                });
            $link.bind("click", function(e){
                if ( !onClick ) {
                    window.location = $(this).attr("href");
                }
                e.stopPropagation();
                return true;
            });
        });
    });
})

Answer 3

$(document).ready(function(){
    $('div.container').css("cursor", "pointer").click(function(){
        window.location = $('a', this).first().attr('href');
    });
});

Answer 4

$("div.container").click(function()
{
  $('a:first', $(this)).click();
});

Answer 5

为了确保这一点，请将函数添加到内部，

$(document).ready(function() { });

否则 div 可能无法在代码运行之前加载。