Javascript Ajax：Ajax响应中的链接不起作用_Javascript_Php_Jquery_Html_Ajax

Javascript Ajax：Ajax响应中的链接不起作用

javascript php jquery html ajax

Javascript Ajax：Ajax响应中的链接不起作用,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,我已经尝试了所有可能的解决方案，但它仍然不适合我我使用ajax从索引页面调用php页面，比如livesearch.php，以获得实时搜索结果 <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script> $("#

我已经尝试了所有可能的解决方案，但它仍然不适合我

我使用ajax从索引页面调用php页面，比如livesearch.php，以获得实时搜索结果

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script>
            $("#livesearch").on("click", "a.alert", function() {
                alert("here");
            });
        </script>   
        <script>
            function showResult(str) {
                if (str.length == 0) {
                    $("#livesearch").empty();
                    $("#livesearch").css('display', 'none');
                    return;
                }

                $.ajax({
                    type: "GET",
                    url: "livesearch.php?q=" + str,
                    success: function(responseText) {
                        $("#livesearch").html(responseText);
                        $("#livesearch").css('display', 'block');
                        $("#livesearch").css('background', '#fff');
                    }
                });
            }
        </script>
    </head>
    <body>
        <form>
            <input type="text" size="30" onkeyup="showResult(this.value)" onblur="showResult('')" placeholder="search here">
            <div id="livesearch" style="height:500px;width:900px;overflow-y:scroll;display:none;z-index:99999;"></div>
        </form>
        <div id="gentext" style="position:fixed;top:40px;z-index:-1;">This is just a dummy text to check if result div overshadow this line or not.</div>
    </body>
</html>

首先，我正在测试，我是否能够捕获从ajax搜索返回的这个链接上的点击，但它不起作用

请在添加链接后定义单击方法：

success: function(responseText)
{
   $("#livesearch").html(responseText);
   $("#livesearch").css('display', 'block');
   $("#livesearch").css('background', '#fff');
   $("#livesearch").on("click", "a.alert", function() 
   {
      alert("here");
   });
}

试试这个，让我们知道控制台返回什么：

$.ajax({
    type: "GET",
    url: "livesearch.php?q=" + str,
    success: function(responseText) {

       console.log(responseText); //CHECK YOUR CONSOLE 

       $("#livesearch").append(responseText);
       $("#livesearch").css('display', 'block');
       $("#livesearch").css('background', '#fff');
       $("#livesearch").find(".alert").click(function(e) {
           e.preventDefault();
           alert("here");
       });
    }
});

实现这一点的另一种方法是像这样构建锚定标记，然后创建JS函数：

myFunction(){
    alert("here")
    return false;
}

很明显，您必须定义

$（“#livesearch”）.on（..

在将链接添加到dom之后，您能为我详细说明一下吗？我正在使用.on（for live）通知事件需要处理的地方会发生其他事情。换句话说，该命令在

$（“#livesearch”）.html（responseText）之后

将此添加为答案。我尝试了您的建议，但仍然没有结果。什么？。因此，您的AJAX工作正常，并且您的警报工作正常。您试图完成什么？是否希望在用户每次单击#livesearch时对您的AJAX结果发出警报？出现以下错误：未捕获的引用错误：resposeText未定义。问题是在您的PHP中存在漏洞。请提供您的PHP。在console.log（resposeText）行中有一个类型错误…立即尝试它将得到结果。我可以在console日志中看到。但单击它不起作用。请尝试

e.preventDefault（）；

我有一个输入错误

myFunction(){
    alert("here")
    return false;
}