jQuery + Jeditable - 检测选择何时更改

Question

我正在使用Jeditable用于就地编辑。我正在使用的控件之一具有 select 类型。当用户单击该字段时，将生成以下选择控件:

<div id="status" class="editable_select">
    <form>
        <select name="value">
            <option value="Active">Active</option>
            <option value="Inactive">Inactive</option>
        </select>
        <button type="submit">Save</button>
        <button type="cancel">Cancel</button>
    </form>
</div>

我想要弄清楚的是如何使用 jQuery 来检测 select 控件何时发生更改，特别是因为它没有 ID 属性。

这是我到目前为止所拥有的，但事件没有被触发:

$(document).ready(function () {
    $('#status select').change(function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});

<小时/>

更新

更新到 jQuery 1.4.2 并使用 Matt 的解决方案解决了我的问题。

Answer 1

您可能会找到它，因为选择字段是在页面加载后(以及事件绑定(bind)发生后)添加到页面的。

如果是这种情况，您仍然可以使用 live 捕获更改事件

$(document).ready(function () {
    $('#status select').live('change', function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});

请注意，从 1.7 开始，on()方法是绑定(bind)事件处理程序的首选方法。与上面的等价的是；

$(document).ready(function () {
    $(document).on('change', '#status select', function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});