2012-05-10 14 views
2

jQueryとjQueryを使用しています。以下は私のマークアップです:jqueryのネストされた要素の検索

<div id="content"> 
    <ul id="sortable">    
    <li class="button_tab"><div id="select_me">Select Me</div></li> 
    <li class="button_tab"><div id="select_me_1">Select Me 1</div></li> 
    <li class="button_tab"><div id="select_me_2">Select Me 2</div></li>   
    </ul> 
</div> 

jqueryの:

$(".button_tab").button(); 

ボタン()関数は、特定のクラス名を挿入するので、私はクリックイベントにID =「select_me」を取得しようとしていますが、何も起こりませんそして私はそれが正しい選択することはできません。

$('div#content ul#sortable li.button_tab div').click(function() { 
    alert($(this).attr('id'));   
}); 
+1

うまく動作しているようですhttp://jsfiddle.net/dhirajbodicherla/mvg4E/ – Dhiraj

+0

私のためにもうまく動作しますhttp://jsfiddle.net/mcgrailm/zQp5L/コンソールにエラーが表示されていませんか? – mcgrailm

+0

何も起こっていないということは何を意味していますか、正確に何を見ていますか、何かエラーがありますか? – Sarfraz

答えて

3

与えられたコードは正常に動作します。しかし、それらを呼び出す順序は重要です。

.button()は、「クリック」を論理的に処理すると考えられるので、すべてのclickイベントをクリアします。したがって、子どものために再度カスタムイベントclickを有効にするためです。あなたが他の.button()

  1. $(".button_tab").button();
  2. $('div#content ul#sortable li.button_tab div').click(function() { alert($(this).attr('id'));
    });

かを呼び出した後clickイベントリスナーを作成する必要があり、あなたは.on()を利用するとjQueryの動的clickイベントリスナーを作成することができます。

+0

はい、あなたは正しいです、ありがとう、私は私のコードで反対の方法をやっていた。 –

+0

@ johnnyj :-)動的な機能が絶対に必要な場合は、 'click'イベントに' .on() 'を実装することができます。 – Niranjan

1

$("#sortable li.button_tab div[id^='button_tab']").click(function() { 
    alert($(this).attr('id'));   
}); 
をお試しください

または

$("#sortable li.button_tab").click(function() { 
    var div_id = $(this).find("div[id^='button_tab']").attr("id"); 
    alert(div_id);   
}); 
関連する問題