0

我需要启用禁用的下拉菜单并从 json 更改值。当我的程序有<select></select><select></select> 我的意思是连续选择时，它可以正常工作，但是当中间有元素时，它就不行了。

索引页面代码：

<ul>
 <li>
  <label>Item 1</label>
  <select name="item1" id="item1" class="update">
   <option value="">Select Item1</option>
   <option value="1">1</option>
   <option value="2">2</option>
  </select>
 </li>
 <li>
  <label>Item 2</label>
  <select name="item2" id="item2" class="update" disabled="disabled">
   <option value="">Select Item2</option>
   /*output based on item1*/
  </select>
</li>
<li>
 <label>Item 3</label>
 <select name="item3" id="item3" class="update" disabled="disabled">
  <option value="">Select Item3</option>
  /*output based on item2*/
 </select>
</li>

在索引中加载的脚本（以及 jquery）：

var formObject = {
    run : function(obj) {
        if (obj.val() === '') {
            obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
        } else {
            var id = obj.attr('id');
            var v = obj.val();
            jQuery.getJSON('/test/mod/update.php', { id : id, value : v }, function(data) {
                if (!data.error) {
                    obj.next('.update').html(data.list).removeAttr('disabled');
                } else {
                    obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
                }
            });
        }
    }
};
$(function() {

    $('.update').live('change', function() {
        formObject.run($(this));
    });

});

我知道我需要改变

obj.next('.update').html(data.list).removeAttr('disabled');

但想不通。

这也适用于 jquery 1.6.4 但不适用于 1.9.1 我需要更改哪个部分以更新代码以与最新的 jquery 兼容？

4

3 回答 3

3

而不是使用.removeAttr('disabled')use .prop('disabled', false)。 .prop自 1.6 以来，它被用作更新元素属性的方法，但在 1.7 之后更是如此

于 2013-04-17T03:32:25.863 回答
2

你应该这样

替换obj.next('.update').html(data.list).removeAttr('disabled'); 为

 obj.parent().next().children().removeAttr('disabled');

jsfiddle：http: //jsfiddle.net/habo/7vMw8/

于 2013-04-17T03:38:09.953 回答
1

该.live()函数在 jQuery 1.7 中被弃用，并在 jQuery 1.9 中被删除。

您可以.on()改用：

$(document.body).on('change', '.update', function() {
    formObject.run($(this));
});

使用 时.on()，使用要为其调用处理程序的元素的最近祖先是最有效的。document.body因此，您可以使用该<ul>元素而不是 using 。不过，如果该元素具有“id”属性会更容易。

为了处理<select>不是兄弟姐妹的元素，我建议改变以下情况：

obj.nextAll('.update').html(...
obj.next('.update').html(...

对此：

obj.closest('li').nextAll().find('.update').html(...
obj.closest('li').next().find('.update').html(...

当然，您还应该.prop()按照@Explosion Pills 的建议用于启用/禁用。

于 2013-04-17T03:49:19.883 回答