1

以下のコードのように、JQuery で実行される 2 番目のプロセスを実行する際に問題があります。

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /></head>
<body>
    <script type="text/javascript" src='jquery-1.6.2.min.js'> </script>
    <div id="displayArea1">
    </div>
    <br/>
    <div id="displayArea2">
    </div>
    <input id="btnSet" type="button" value="Set The Value" />
    <script>

        //The input that should i use
        var itemToPrintOut1 = "[Input1 (working)]     Search <strong style='cursor:pointer' title='Click here'>IP{<span id='ip1'>192.168.2.56,192.168.2.89,192.168.2.75</span>}</strong> that has accessed to MAIL-SERVER{192.168.2.8}";
        var itemToPrintOut2 = "[Input2 (not working)] Search <strong style='cursor:pointer' title='Click here'>IP{<span id='ip2'>192.168.2.56,192.168.2.89,192.168.2.75</span>}</strong> that has accessed to MAIL-SERVER{192.168.2.8}";

        $("#displayArea1").html(itemToPrintOut1);  //If I enable this line, it is works as what i want(because it is using jquery)

        $("#btnSet").click(function(){
            $("#displayArea2").html(itemToPrintOut2);
        });

        $("#ip1").click(function(){
            alert("Normal method, data = " + $("#ip1").html());
        });

        $("#ip2").click(function(){
            alert("The method I should use, data = " + $("#ip2").html());
        });
    </script>
</body>

初めて（読み込み中）itemToPrintOut1テキストが表示され、IPアドレスをクリックできます。私はそれについて問題はありません！

しかし、ボタンをクリックして 2 番目のテキストを表示するとitemToPrintOut2、IP をクリックできなくなります。

2番目の出力をJQUERYでも使用できるようにする方法について、誰か助けてもらえますか。私にもこの問題に関連することがたくさんあります。JQueryの読み込みに関連していますか?

ありがとう

4

3 に答える 3

1

まだ存在しない要素にハンドラーをバインドしようとしている場合は、次のようにしてください。

<script>

    //The input that should i use
    var itemToPrintOut1 = "[Input1 (working)]     Search <strong style='cursor:pointer' title='Click here'>IP{<span id='ip1'>192.168.2.56,192.168.2.89,192.168.2.75</span>}</strong> that has accessed to MAIL-SERVER{192.168.2.8}";
    var itemToPrintOut2 = "[Input2 (not working)] Search <strong style='cursor:pointer' title='Click here'>IP{<span id='ip2'>192.168.2.56,192.168.2.89,192.168.2.75</span>}</strong> that has accessed to MAIL-SERVER{192.168.2.8}";

    $("#displayArea1").html(itemToPrintOut1);  //If I enable this line, it is works as what i want(because it is using jquery)

    $("#btnSet").click(function(){
        $("#displayArea2").html(itemToPrintOut2);

         $("#ip2").click(function(){
               alert("The method I should use, data = " + $("#ip2").html());
         });
    });

    $("#ip1").click(function(){
        alert("Normal method, data = " + $("#ip1").html());
    });

</script>

次に をクリックすると、 html とそのハンドラip1が追加されます。ip2

于 2012-07-25T06:04:33.533 に答える
1

クリック イベントを ip2 に追加すると、存在しません。ページの後半に表示されるものにイベントをバインドする jquery 'live' を使用できます。

$('#ip2').live('click',function() {});

そして、「ip2」のIDを持つ場合、後でドキュメントに追加されるdom要素のクリックイベントをバインドします

于 2012-07-25T06:06:59.067 に答える
1

実行時にイベントをバインドするには、.click() の代わりに .live() を使用できます。.live() は推奨されていないため、.on() メソッドを試してみてください。

于 2012-07-25T06:07:10.457 に答える