Question

我正在使用ASP.NET MVC 4和jQuery来实现这一目标。

我要做的是根据是否选中复选框来禁用或启用下拉列表。

我可以使用它，但我似乎无法在pageload上禁用下拉列表。语句已执行，但该元素未被禁用。

我认为问题是，是否已执行检查，在填充下拉列表（来自视图模型）之前，数据会以某种方式覆盖？

这是我的HTML：

<p>
    @Html.CheckBoxFor(model => model.RoomRequired, new { id= "room-required" })
    <label>Room Required</label>
</p>
<p>
    <label>Room Options</label>
    @Html.DropDownListFor(model => model.OptionId, new SelectList(Model.RoomOptions, "Id", "Name"), "Select option", new { id="option-select })
</p>

并修正了Javascript：

$(document).ready(function () {    
    $('#room-required').change(function () {
     $('#option-select').prop('disabled', $(this).is(':checked'));
    });

    $('#room-required').trigger('change');
});

Answer 1

.prop()是更改disabled属性的首选，您可以将其传递给布尔值，因此您的代码可以简化为：

$('#option-select').prop('disabled', $('#room-required').is(':checked'));

或完整代码：

$(document).ready(function () {    
    $('#room-required').change(function () {
         $('#option-select').prop('disabled', $(this).is(':checked'));
    });

    $('#room-required').trigger('change');
});

Fiddle

Answer 2

我有点解决了这个问题。出于某种原因，jQuery重新启用了下拉列表。我不得不在HTML页面本身添加一个javascript脚本并在那里触发change事件。我知道这不是最好的解决方案，但它是一种适合我的解决方法。

Answer 3

attr()做的是将第二个参数中的值赋给HTML元素的指定属性。我们想要<input disabled="disabled" />而不是<input disabled="true" />。

所以，使用 -

$('#option-select').attr('disabled', 'disabled');

而不是 -

$('#option-select').attr('disabled', 'true');

ASP.NET MVC在页面加载时禁用下拉列表

3 个答案: