JQuery $ .click / $。on("点击")无法使用$ .GET / $ .POST返回HTML

时间:2014-11-07 15:40:09

标签: jquery ajax

我正在使用jQuery $ .GET从远程服务器应用程序中搜索搜索结果,并且我希望返回的链接在单击后触发另一个jquery $ .GET请求。

在下面的示例中,我只是试图阻止链接打开页面甚至event.preventDefault()方法失败。

问题是我的.click()或.on(“click”)事件处理程序都没有在示例页面中触发。

当然,我不得不使用CORS扩展在Chrome中本地开发,但我无法找到阻止.click事件的地方。

我也试过使用$ .POST也没有成功。

我已经有一段时间了,并且已经搜索了一些关于为什么没有发生这种情况的合理解释。

search.html

<form action="search.html" method = "post" id="searchForm">
<input type="input" name="q" id="q" />
<input type="submit" value="Search K-Tube" id="submitForm" />

</form>

<pre id="response"></pre>

 <script src="https://code.jquery.com/jquery-1.11.1.js"></script>
  <script src="js/ktube.js"></script>
   <script src="js/common.js"></script>

ktube.js

 $("document").ready(function () {

 $('a [id^="tubeLink"]').on("click", function (event) {
   event.preventDefault();

 });

  $("#searchForm").submit( function (event) {
    event.preventDefault();

    var q = $("#q").val();

    if (q != "") {
       $.get("http://ktube.kellerisd.net/education-center?search=" + q + "&global_search=true", function(data) {
                 var count=0;
                var thumbs = $(data).find(".thumbDescription h5"); //Finds the Video Thumbnails Titles


                var output = "<h2>Results</h2><ul>";

                $(thumbs).each(function(index, value){

                var link = $(this).find("a").attr("target", "_blank"); //Finds the links and opens them in new browser window
                link = $(link).attr("href", "http://ktube.kellerisd.net" + (link).attr("href")); // Creates an absolute URL for Video on Ktube
                link = $(link).attr("id", "tubeLink" + index);

                output += "<li>"+ $(this).html(); +"</li>";
                count++;
                });

                output += "</ul><br />Total Results: " + count;


                $("#response").html(output);

        });
   }else {
    alert("Please enter a search term");
   }



  });


});

1 个答案:

答案 0 :(得分:1)

使用此:

 $("#response").on("click",'a [id^="tubeLink"]', function (event) {
   event.preventDefault();

 });

当您添加点击处理程序时,添加点击处理程序的元素必须存在于dom中。