0

article 要素内にリンクがあります。要素をクリックすると、チェックボックスがchecked属性になります。ただし、この要素内のリンクは無効です。

このスクリプトを改善してリンクを利用できるようにするにはどうすればよいですか?

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 に答える