0

まず、主題が明確でない場合は申し訳ありません。

シンプルなシーケンスメニューを作成しようとしています。ユーザーが最初のオプションをクリックすると、新しいサブオプションが表示されます。コードはそれ自体を物語っていると思います。

<div id="box">
Welcome text<br>
<ul>
    <li class="option" id="opt1">Option 1</li>
    <li class="option" id="opt2">Option 2</li>
</ul>
</div>

<script>
var nextText = "<p>Next text with two more options.</p><ul><li class='option' id='opt1a'>Option 1a</li><li class='option' id='opt1b'>Option 1b</li></ul>";

$("#box li").click(function() {
  var ev = $(this).attr('id');
  if (ev==="opt1") {
    $("#box").html(nextText);
  }
});
</script>
4

1 に答える 1

0

ページが最初に読み込まれたときに存在していた要素にクリック ハンドラーをバインドしています。後で追加される要素にはクリック バインディングがありません。これは、委譲を使用して jQuery で解決できます.on。

$("#box").on("click", "li", function() {
    var ev = $(this).attr('id');
    if (ev = "opt1") {
        $("#box").html(nextText);
    }
});
于 2013-07-05T17:29:11.410 に答える