jQuery для функции, не срабатывающей в усах?

Я использую $(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');
    });
});

Есть ли что-то еще, что мне нужно сделать, чтобы связать событие изменения с отображаемым шаблоном усов?


javascript jquery mustache
person TheRiddler    schedule 24.01.2015    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Здесь вы используете делегирование, но опять же на динамически сгенерированном узле.

Попробуйте это вместо этого:

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

Или, в качестве альтернативы, вы можете просто заменить document элементом, присутствующим в DOM во время загрузки.

person karthikr    schedule 24.01.2015
comment
Вы можете, без вреда, но вам не нужно .. если вы используете document, его не нужно оборачивать document.ready - person karthikr; 25.01.2015