1 
<div class="hidden" id="build_blankrow">
    <span class="track_title"></span>
    <span class="track_time"></span>
    <span class="track_artist"></span>
    <span class="track_album"></span>
    <span class="track_number"></span>
    <span class="track_options">
        <span class="track_options_download"></span>
        <span class="track_options_addtoplaylist"></span>
        <span class="track_options_playnow"></span>
    </span>
</div>

これは、検索 (AJAX) の結果ページをレンダリングするために使用される非表示の DOM 要素です。有効な情報を更新して入力した後、上記の要素を複製 (true) してページに追加します。この問題は、クラス「track_options」内の要素が別の方法で動作する必要があるという事実に起因しています。デフォルトのアクションを防止することで動作を完全に削除する StackOverflow に関する他の質問があります (この投稿の最後にリンクします) が、親から継承された onClick イベントを削除し、各要素に固有のアクションを追加したいと考えています。

StackOverflow はまだ新しいので、有益だと思われる質問があればお気軽にお尋ねください。

正しい方向へのポインタでもありがとうございます！

onclickイベントでdiv内の「a」のonclickイベントのバインドを解除します

4

2 に答える 2

4

できることは、その div 内のすべてのスパンにクリック関数を指定して、クリック イベントの伝播を停止することです。このコードはテストしていませんが、次のようになります。

$('#build_blankrow').click(function(ev) {
   // .....
});
$('#build_blankrow > span').click(function(ev) {
     ev.stopPropagation() // this ensures that the event won't bubble up to your div
    // put in your own code here
});

http://api.jquery.com/event.stopPropagation/をチェックしてください

乾杯！

于 2012-08-10T23:47:27.823 に答える
2

あなたの探求は少し混乱していますが、私はあなたの目標を達成するための多くの方法のほんの一部を完全に分類しようとします.

  • 初め

特定の子によってトリガーされない親 Div のクリックを作成しようとしている場合は、次のように単純にevent.stopPropagation()を使用できます。

// Noticed I did not use an ID call here for your parent div, the reason is simple,
// You stated you use it like a "template" and clone it, or at least parts from it, thus it might 
// (depending on how you use it) have multiple positions in your document, thus, one set ID just 
// will not do.  So I pretended as if you had already added a similar named class to the parent
// div, thus calling forth this click function on ALL div's containing said class
$(".build_blankrow")
    //  This call to .live will ensure you can call the click function dynamically 
    //  on "future" created divs containing the same class name
    .live("click", function(e) { /* do work */ })
    //  This is called "chaining" in jquery
    //  Our .live click func returns the originally called '$(".build_blankrow")'
    //  ALSO: in NEWER jQuery, .live is replaced with .on
    //  Thus we dont need to make a new call just to get to its childrean
    //  .find will allow us to search the children for exactly what we need
    //  in this case we're grabbing the span with the class 'track_options'
    //  and setting its click func (this will effect its children) to stop propagation to parents
    .find(".track_options")
    .live("click", function(e) { e.stopPropagation(); });
  • 2番

track_options のすべての子で stop prop を使用したくない場合があるため、.filter()を使用します。この便利な jQuery 関数を使用すると、選択した track_options の内部要素で prop を正確に停止できます。以下の例を参照してください。

//  You will notice not much change at start
$(".build_blankrow")
    .live("click", function(e) { /* do work */ })
    .find(".track_options span")
    //  Here comes the change, gota love .filter
    //  Here I will get only the children elements for download and play now
    .filter(".track_options_download, .track_options_playnow")
    //  KEEP IN MIND, if your using NEWEST jQuery, then replace .live with .on
    // like so: .on("click", funct.....
    .on("click", function(e) { e.stopPropagation(); console.log("WHAT"); });
  • 三番

jQuery の CSS セレクターを利用して、必要に応じて各要素に到達する巧妙な方法を考え出すことができます。何かのようなもの：

$(".build_blankrow")
    .on("click", function(e) { /* do work */ })
    //  Here I use simple CSS to filter out the autoplaylist child
    .find(".track_options span:not(.track_options_addtoplaylist)")
    .on("click", function(e) { e.stopPropagation(); });

前のコードで使用された重要な jQuery リンク:

  1. 。住む（）
  2. 。の上（）
  3. 。クリック（）
  4. 。探す（）
  5. 。フィルター（）
  6. .stopPropagation()
  7. jQuery セレクター

他に興味深いもの (食べたくない 4 歳児に対処しなければならないことを除いて、例を示します! grrr) は.andSelf()です。次のように、 track_options とその子の 1 つまたは 2 つを取得するための呼び出しを行うことができます。$(".track_options).find("span:not(.track_options_addtoplaylist)").andSelf();

于 2012-08-11T00:46:03.933 に答える