车把模板中的js事件

时间:2015-06-18 23:14:47

标签: javascript jquery handlebars.js

当我点击一个按钮时,我的模板会有一张桌子。

当我双击手柄模板中的一行表格时,我想做一个动作。

<body>
<script id="lodgerSearchResult-template" type="text/x-handlebars-template">
    <div class="span12">
    <table id="lodgerSearchResultTable" data-show-header="true" class="table" data-toggle="table" data-height="250">
    <thead>
    <tr>
    <th>#</th>
    <th>Nom</th>
    <th>Date de naissance</th>
    <th>N.A.S.</th>
    <th>N.A.M.</th>
    <th>Immeuble</th>
    </tr>
    </thead>
    <tbody>
       {{#each this}}
       <tr>
         ...
         ...
       </tr>
       {{/each}}
    </tbody>
  </table>
</script>
</body>



<script>
   $('#lodgerSearchResultTable > tbody').dblclick(function () {
    alert($(this).text());
   });
</script>

实际上,没有任何事情发生。

编辑:我将双击事件放在ajax成功答案

$('#lodgerSearch').on('click', function (e) {

    var searchParam = $('#srch-term').val();
    var url = "http://localhost:8080/lodgers/search";
    if (searchParam != "") {
        url = "http://localhost:8080/lodgers/search?searchTemp=" + searchParam;
    }

    jQuery.ajax({
        type: "GET",
        url: url,
        success: function (data, status, jqXHR) {

            $("#lodgerSearchResult").empty().append(template(data));
            // is the line i added
            $('#lodgerSearchResultTable > tbody').dblclick(function () {
                alert($(this).text());
            });

        },
        error: function (jqXHR, status) {
            // error handler
            alert("error " + jqXHR + " -  " + status);
        }
    });
    // e.preventDefault();
});

是否有更清洁的方法来做同样的事情?

1 个答案:

答案 0 :(得分:1)

我的意思是:

<script>
  alert('table before: ' + String($('#lodgerSearchResultTable')));
  $( document ).ready(function() {
     alert('table after: ' + String($('#lodgerSearchResultTable')));
     $('#lodgerSearchResultTable > tbody').dblclick(function () {
        alert($(this).text());
     });
  });
</script>

其他非明确的解决方案

<script>

  $( document ).ready(function() {

     $('#lodgerSearchResult').dblclick(function (event) {

        console.log(event.target);

        var res_table = $('#lodgerSearchResultTable > tbody');
        if( res_table ) {
            alert(res_table.text());
        }
     });
  });
</script>