2 
<div id=ControlId>
    <span>Select Option</span> 
</div>
</div>

<div id=ControlId + "_child"  style="display: none" > 
    <table>
        <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="Bike" /> option 1</td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="Car" /> option 2</td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="dog" /> option 3</td>
        </tr>
    </table>
</div>

divこれを自分のページに複数回追加しました。をダイナミックに変化させControlIdます。最後に追加されたコントロールにのみ適用されるjQueryclickイベントに次のコードを追加しました

$("#" + ControlId).click(function () {
    $("#" + ControlId + "_child").fadeIn("slow");
    $("#" + ControlId + "_child").toggle();
});

最後に追加されたコントロールにのみ適用されるすべての ControlId のクリック イベントのイベントを取得する方法は?

1回追加すると、複数回正常に動作するということは、問題が発生したことを意味します

4

1 に答える 1

2

メインの div が の親である場合は、これを試してください"#" + ControlId + "_child":

$('div[id$="_child"]').parent().on('click', function(){
    var child = $(this).find('div[id$="_child"]').last();
    child.fadeIn("slow");
    child.toggle();
});

ただし、現在のアプローチに反対することを強くお勧めします。代わりにこれを試してください：

 <div id=ControlId class="control-main">
 <span>Select Option</span> 

 <div id=ControlId + "_child"  class="control-child" style="display: none" > 
 // your other html here
 </div>

JS:

$(document).on('click', '.control-main', function(){
    $('.control-child').last().fadeIn("slow").toggle();
});
于 2013-06-12T12:12:12.050 に答える