1 
jQuery('#sbox-window').on('change', '#filter-by-site', function(){
    console.log(jQuery(this).val());
    console.log('change');
});


<div id="sbox-window">
    <div id="sbox-content">
        <p>
            <select id="filter-by-site">
                <option value="null">Filter cameras by site</option>
                <option value="1">Site 1</option>
                <option value="2">Site 2</option>
                <option value="3">Site 3</option>
            </select>
        </p>
    </div>
</div>

什么都没有发生...弃用live()一切正常。问题出在哪里？

4

8 回答 8

3

实际上这有效。您是否有可能将事件附加到作为 Jquery 模板一部分的“sbox-window”或动态生成 div 的其他方式？根据实现，“sbox-window” div 在文档中不存在，准备好了，所以你需要冒泡到更高的 Dom-Object --- 文档的最坏情况......但我不会建议...这也是“现场”有效的原因。

于 2012-12-14T11:15:41.930 回答
1

采用：

jQuery(document).on('change', '#sbox-window #filter-by-site', function(){
    console.log(jQuery(this).val());
    console.log('change');
});

因为当你这样做jQuery('#sbox-window')的时候还没有这样的元素（因为 DOM 是按顺序构造的并且你定义了更低的块），所以你on为空元素数组调用方法，当然没有效果。

如前所述，还有另一种选择：

$(document).ready(function() {
   $('#sbox-window').on('change', '#filter-by-site', function(){
       console.log($(this).val());
       console.log('change');
   });
});
于 2012-12-14T11:10:38.543 回答
0

这对我来说可以：

演示

该on()方法已添加到 jQuery 版本 1.7 中。请确保您已包含足够新版本的 jQuery。

于 2012-12-14T11:10:37.183 回答
0

也许在你使用委托的时候，#sbox-window它还没有在 DOM 中。将其包装在就绪回调函数中：

$(function(){
   jQuery('#sbox-window').on('change', '#filter-by-site', function(){
       console.log(jQuery(this).val());
       console.log('change');
   });
});

.live() 使用文档作为委托。

于 2012-12-14T11:12:30.960 回答
0

它工作正常，请参阅一个工作示例，因此您似乎缺少的是在 DOM 就绪处理程序上执行您的查询代码。

$(document).ready(function() {
   $('#sbox-window').on('change', '#filter-by-site', function(){
       console.log($(this).val());
       console.log('change');
   });
});
于 2012-12-14T11:13:16.030 回答
0

您可以在元素上使用 $.bind 。

或者，更好的是，您可以在不使用 jquery 的情况下做到这一点，只需：

document.querySelector('#filter-by-site').addEventListener('change', changeHandler);

function changeHandler(e) {
    console.log('change');
}
于 2012-12-14T11:14:20.400 回答
0

你也可以使用这种方式：

jQuery(document).on('change', '#filter-by-site', function(){
   console.log(jQuery(this).val());
   console.log('change');
});
于 2012-12-14T11:18:36.377 回答
0

使用最新版本的 jquery 库，它工作正常

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
于 2012-12-14T11:23:17.107 回答