Question

我有以下脚本。当用户单击搜索按钮但它只能工作一次时，它可以工作。请指导我如何让它更有效点击。谢谢，

 <form action="" method="get" id="searchform">
   <input name="q" type="text" id="search" size="32" maxlength="128" class="txt">
   <input type="button" id="hit" value="Search"  class="btn">
 </form>

<script type="text/javascript">
  var nexturl ="";
  var lastid ="";
  var param;
  $(document).ready(function () {
    $("#hit").on("click", function myFunction() {
      param = $('#search').val();
      alert("I am an alert box!");
      if (param != "") {
        $("#status").show();
        var u = 'https://graph.facebook.com/search/?callback=&limit=100&q='+param;
        getResults(u);
      }

      $("#more").click(function () { 
        $("#status").show();
        $("#more").hide();  
        pageTracker._trackPageview('/?q=/more');
        var u = nexturl;
        getResults(u);
      });
    });
  });
</script>

Answer 1

我知道之前已经多次询问过这个问题，但现在是：

$(document).on("click", "#hit", function() {
  ...
});

您需要让事件冒泡到文档中，因此对DOM的更改不会消除您的事件处理。

这是a jsFiddle。让我知道你在看什么。

Answer 2

如果您实际上没有提交表单并且只是运行JavaScript，那么您应该将其作为onsubmit在表单上运行，如下所示：

<form id="searchform" onsubmit='return submitForm()'>
  <input name="q" type="text" id="search" size="32" maxlength="128" class="txt"  >
  <input type="button" id="hit" value="Search"  class="btn">
</form>

<script type="text/javascript">
  var nexturl ="";

  function submitForm(){
    var lastid ="";
    var param = $('#search').val();

    alert("I am an alert box!");
    if (param != "") {
      $("#status").show();
      var u = 'https://graph.facebook.com/search/?callback=&limit=100&q='+param;
      getResults(u);
    }

    //Prevents the form submitting
    return false;
  }

  $("#more").click(function () { 
    $("#status").show();
    $("#more").hide();  
    pageTracker._trackPageview('/?q=/more');
    var u = nexturl;
    getResults(u);
  });
</script>

更多按钮是否始终存在或者是否是动态添加/删除的按钮？如果是这样，您可能需要执行类似

的操作

$("body").on("click", "#more", function () { 
  $("#status").show();
  $("#more").hide();  
  pageTracker._trackPageview('/?q=/more');
  var u = nexturl;
  getResults(u);
});

代替。

Answer 3

它也适用于第二次搜索。第二次搜索的项目只会附加到搜索结果列表中，也许这就是为什么你看不到它们。试试$（“＃data”）。empty（）;在开始附加新搜索查询的结果之前。

JavaScript只工作一次

3 个答案: