0

我在文章元素中有链接。单击元素时，复选框会实现选中属性。但是这个元素内的链接是不活动的。

我如何改进此脚本以使链接可用？

http://jsfiddle.net/57GsC/

<article class="post short-post">
   <header><h3 class="post_title"><a href="/posts/2">Yo</a></h3></header>
    <input type="checkbox" value="" name="post_check" class="post-check center-align">
    <div class="post-body">Mauris nec nisl justo. Suspendisse quis metus venenatis turpis feugiat euismod ac semper arcu. Vestibulum </div>
    <footer>
        <div class="links">
         <a class="edit button" href="/posts/2/edit">Edit Post</a>
         <a rel="nofollow" data-method="delete" class="delete button" href="/posts/2">Delete a Post</a>
         <a class="view button" href="/posts/2">View</a>
        </div>
    </footer>
</article>

$(".short-post").click(function(evt) {
  var $checkbox;
  if (evt.target.type !== "checkbox") {
    $checkbox = $(":checkbox", this);
    $checkbox.attr("checked", !$checkbox.attr("checked"));
    evt.stopPropagation();
    return false;
  }
});
4

3 回答 3

1

您的链接被禁用，因为您最后返回 false。在链接标记上捕获单击事件后返回 false 会停止执行链接。

于 2012-06-15T08:14:28.003 回答
0

在这个小提琴中，我刚刚删除了 jquery 代码并使用了标准label元素，该元素似乎可以执行您打算执行的操作（以及您的用户可能期望执行的操作）。

<input id=someId type="checkbox" value="" name="post_check" class="post-check center-align">
<label for=someId>Mauris nec nisl justo. Suspendisse quis metus venenatis turpis feugiat euismod ac semper arcu. Vestibulum </label>

我在这里假设您不想通过简单的单击执行 2 个操作（更改复选框并点击链接）。我你真的想要你当然可以简单地不返回 false 但这对用户来说太糟糕了。

于 2012-06-15T08:12:32.680 回答
0

删除return false;语句

于 2012-06-15T08:18:25.653 回答