25

我有一个使用 ajax 调用动态填充的选择字段，该调用仅返回所有 HTML 选择选项。这是 PHP 的一部分，它只是回显选择标签并动态填写每个选项/值。

echo "<select name='player1' class='affector'>";
echo "<option value='' selected>--".sizeof($start)." PLAYERS LOADED--</option>";

foreach ($start as $value) {
    echo "<option value='".$value."'>".$value."</option>";
 }  
  echo "</select>";
}

填充此列表后，我尝试调用更改事件，以便每当在 SELECT 列表或具有相同类的文本字段中更改默认选项时，它会禁用在表单的另一部分中设置的单选按钮. （您可以在此处看到我提出的让这部分功能正常工作的最初问题）

$('.affector').change(function(){
       $(this).parents('tr').find('input:radio').attr('disabled', false);
});

出于某种原因，即使我为选择字段提供了正确的类名（影响器），当我在该字段中选择不同的选项时，表单的其他部分也不会禁用。具有相同类的静态文本字段工作正常。我难住了。

有任何想法吗？

4

7 回答 7

20

刚刚评论了你的最后一个问题......这就是我所说的：

使用 jQuery 绑定

function addSelectChange() {
   $('select').bind('change', function() {
       // yada yada
   });
}

在您的 ajax 成功函数中调用 addSelectChange。它应该可以解决问题。也看一下 jQuery 实时事件（当你想在以后的项目中为所有当前和未来的 DOM 元素设置事件时）。不幸的是，live 还不支持更改事件和其他一些事件。绑定是下一个最好的东西

于 2010-01-09T00:54:06.470 回答
8

一个更新的答案..

由于元素是动态填充的，因此您正在寻找事件委托。

但是，不要使用.live()/ .bind()/ .delegate()。你应该使用.on().

根据jQuery API 文档：

从 jQuery 1.7 开始，该.on()方法是将事件处理程序附加到文档的首选方法。对于早期版本，该.bind()方法用于将事件处理程序直接附加到元素。处理程序附加到 jQuery 对象中当前选定的元素，因此这些元素必须存在于调用.bind()发生的点。有关更灵活的事件绑定，请参阅 中关于事件委托的讨论.on()。

因此你会使用这样的东西：

$(document).on('change', 'select', function (e) {
    /* ... */
});
于 2015-01-05T00:36:33.470 回答
5

使用 .live() 的示例

$('#my_form_id select[name^="my_select_name"]').live('change', (function () {
    console.log( $("option:selected", this).val());
    })
 );
于 2011-08-29T14:04:24.450 回答
3

对于动态插入到 DOM 中的项目，它们的事件必须与

$('.selector').bind('change',function() { doWork() });

这是因为当您使用or等​​运行$(function(){});和绑定事件时，您将事件绑定到DOM 中已经存在的元素。之后您所做的任何操作都不会受到通话中发生的任何事情的影响。告诉你的页面在你的选择器中寻找未来的元素以及当前的元素。$.click$.change$(function(){});$.bind

于 2010-01-09T00:53:37.370 回答
1

尝试.live： http ://docs.jquery.com/Events/live

来自文档：将处理程序绑定到所有当前和未来匹配元素的事件（如点击）。也可以绑定自定义事件。

于 2010-01-09T00:53:54.997 回答
1

我发现解决方案只做

<select id="myselect"></select>

在 php/html 文件中，然后通过 ajax 为其生成选项：

$.post("options_generator.php", function (data) { $("#myselect").append(data); });

仅在 options_generator.php 回显选项中：

echo "<option value='1'>1</option>";
echo "<option value='2'>2</option>";
于 2012-04-26T11:01:24.673 回答
0

请改用 delegate() 函数。更多关于这里http://www.elijahmanor.com/differences-between-jquery-bind-vs-live-vs-delegate-vs-on/

于 2014-06-16T17:14:38.090 回答