0

我知道 .change() 可用于检测文档上的更改,但这似乎仅在加载时存在 select 元素时才有效。

我有一个通过 ajax 调用大量选择元素的页面,我需要检测每个选择的更改。

有任何想法吗?

4

3 回答 3

3

执行此操作的两种常用方法是:

  1. 将元素添加到页面后(从您的 Ajax 成功处理程序中或任何地方).change()使用适当的选择器调用。

  2. 设置附加到页面加载时确实存在的父元素或祖先元素的委托事件处理程序(document如果没有更近的祖先)。

以下是使用方法创建委托处理程序的.on()方法

$("#idOfAncestorThatExistsOnLoad").on("change", "selectorOfDynamicElements", function() {
     // do something here
});

当 change 事件冒泡到祖先元素时,jQuery 会自动测试它是否源自与第二个参数中的选择器匹配的元素,并且只有在匹配时才调用处理函数。

于 2013-10-16T09:32:53.760 回答
0

一个好的方法是将事件与特定的选择器绑定

$(document).on('change', 'select', handlerFunction);

现在您的事件处理程序已绑定document但仅影响select元素。如果您使用 AJAX 加载一些数据,则处理程序将立即使用新的选择。

于 2013-10-16T09:33:01.230 回答
0

你可以这样做,

select

<select name="demo" id="demo"  onchange="selectRequest('demo');"> 

js文件中

function selectRequest(id) // id of select
{
   var selectVal = $('#' + id).val(); // currently selected 
   // rest do with the val
}

无需屈服$(document).ready()

这是工作代码,

<html>
    <head>
        <title>Test</title>
        <script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
        <script>
            function selectRequest(id) // id of select
            {
                var selectVal = $(id).val(); // currently selected 
                alert(selectVal)
                // rest do with the val
            }
        </script>
    </head>
    <body>
        <select name="demo" id="demo"  onchange="selectRequest(this);"> 
            <option value='1'>1</option>
            <option value='2'>2</option>
        </select>
    </body>
</html>
于 2013-10-16T09:43:42.327 回答