0

私の問題は、AJAX によって返された要素で Java スクリプトを実行する方法です。JavaScript は、AJAX によって返されたものでは機能しません。私のスクリプトでは、「Hello」というダイアログ ボックスが表示されるはずですが、そうではありません。どうすればそれを機能させることができますか、またはこれには別の方法がありますか? アドバイスをありがとう。

以下は私のコードです...

index.html

<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>


        <script type="text/javascript">
            $(document).ready(function() {
                $("#box_1").on("click", function() {
                    alert("Hello!");
                });

                changeDisplay();
            });

            function changeDisplay() {
                if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }

                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }

                xmlhttp.onreadystatechange=function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        document.getElementById("text").innerHTML=xmlhttp.responseText;
                    }

                }
                xmlhttp.open("POST","ajaxHandling.php",true);
                xmlhttp.send();

            };
        </script>    
    </head>
    <body>
        <h1>Ajax Test</h1>
        <div id="text">

        </div>
    </body>
</html>

ajaxHandling.php

<?php
    echo '<div id="box_1" class="box">Click me</div>';
?>
4

2 に答える 2

4

on()よくある問題として、スクリプトの実行時に存在する future 要素の親にバインドして、future 要素の正しい構文を使用する必要があります。

$(document).on("click", "#box_1", function() {
    alert("Hello!");
});

ドキュメントを使用しましたが、最も近い既存の親を使用する方が優れています。例：

$("#wrapper").on("click", "#box_1", function() {
    alert("Hello!");
});
于 2013-03-12T16:09:44.970 に答える
0

私の簡単な答えは、 jQuery.onを使用して、クリック イベントを少し異なる方法でバインドする必要があるということです。

$('#text').on('click', '#box_1', function() {
    alert('Hello!');
});

これにより、クリック イベントが、セレクターに一致する#text要素内の (または後で要素に追加された)任意のアイテムに動的にバインドされます。#text#box_1

私の長い答えは、jQuery を使用している場合は、独自のライブラリを作成するのではなく、その AJAX ライブラリも利用する必要があるということです。

$.ajax({
    url: '/ajaxHandling.php',
}).done(function ( data ) {
    $('#text').html(data);
});
于 2013-03-12T16:12:46.087 に答える