jQuery上的函数没有在胡子中触发？

Question

我正在使用$(Mustache.to_html 在我的网页上呈现模板 - 如果我检查页面上呈现的实际 html，如下所示：

<script id="myTemplate" type="text/x-template">
<tr data-name="{{name}}">
    <td>
    <select id="titlesDropDown" name="SelectedTitleId"><option value="">--Select Title--</option>
    <option value="1">Mr</option>
    <option value="2">Miss</option>
    <option value="3">Mrs/Corporate</option>
    <option value="4">Dr</option>
    </select>
    </td>
    <td>{{name}}</td>
    <td><input type="text" name="Age" value=""/></td>
</tr>
</script>

我遇到的问题是我想在标题下拉列表更改时触发一个函数。在准备好的文档中，我添加了以下内容：

$(document).ready(function () {   
    $('#titlesDropDown').on('change', function () {           
        alert('Dropdown change fired');
    });
});

我还需要做些什么来将更改事件连接到小胡子渲染模板吗？

Answer 1

在这里，您正在使用委托，但它再次位于动态生成的节点上。

试试这个：

 $(document).on('change', ''#titlesDropDown'', function () { 

或者，您也可以将document 替换为加载时存在于DOM 中的元素。