javascript - 为什么动态创建的按钮不起作用？

Question

我有一个搜索页面，当单击按钮时，它会显示搜索结果。但是，在结果页面中，当我继续搜索某些内容时，按钮似乎没有响应：

这是脚本：

    <div id="mainpage" >
    </div>

<script id="search" type="text/xml" >

                <div>

                    <input type="search" name="search" data-style="mini" data-theme="d" placeholder="search" value=""/> 
                    <button id="searchButton" type="submit" onClick="app.navigate('#home/search',{trigger: true});">Search</button>

                </div>
                <div>

                    <table >
                           {{result}}
                    </table>

                </div>

  </script>

这是后面的部分渲染页面：

  if(route=='search'){

      var data = $.mobile.activePage.find("input[name=search]").val();
      /*

       code to filter the result

      */

      $('#mainpage').html(_.template($('#search').html())(    
      { 
            result: resultvalue }
      )); 



  }

Answer 1

您的 javascript 无效是第一个问题。

您将_.template提前关闭您的方法调用。

尝试用这个替换它：

if (route === 'search') {

    var data = $.mobile.activePage.find("input[name=search]").val();

    ...

    $('#mainpage').html(_.template($('#search').html(), {
        result: resultValue
    }));

}

编辑

尝试用这个替换按钮上的 onclick 事件：

onclick="app.navigate('#home/search',{trigger: true}); return false;"

您的 onclick 事件可能正在发生，但您并没有停止提交按钮的默认行为。