<select name="state" class="select" id="state">
<option value="something">Something</option>
<option value="other">Other</option>
</select>
<input type="text" name="province" class="text" id="province" />
JQuery
$('#state').change(function () {
if ($('#state Other:selected').text() == "Other"){
$('#province').attr('disabled', false);
alert(1);
} else {
alert(2);
}
});
Кажется, не работает. Я должен делать что-то неправильно.
Вы должны использовать .removeAttr('disabled') вместо .attr('disabled', false). Также вы должны кэшировать селектора jQuery.
Изменить: Мысли об этом после этого факта. Вы можете "удалить" текст, который был введен в поле, если вы его отключили, поэтому я добавил .val(''), если вы также хотели скрыть его, вы можете добавить .hide() и .show() в два случая.
Я собрал эту скрипту, чтобы показать вам рабочую версию:
var $state = $('#state'), $province = $('#province');
$state.change(function () {
if ($state.val() == 'other') {
$province.removeAttr('disabled');
} else {
$province.attr('disabled', 'disabled').val('');
}
}).trigger('change'); // added trigger to calculate initial state
.trigger('change') будет "запускать" событие изменения, эффективно запуская функцию один раз, когда вы ее связываете. Таким образом, #province будет либо отключен, либо включен в зависимости от состояния, выбранного во время запуска кода. Без него провинция была бы доступна, даже если государство не является "другим", если вы не добавили disabled='disabled' в тег <input> в свой html.
Вам нужно установить "отключено" на true, чтобы фактически отключить что-то. Например, если вы хотите отключить "Другое" и включить все остальное, я предлагаю сказать:
$('#state').change(function () {
$("#province").attr("disabled", $("#state").val() == "other");
});
В этом случае используется $("#province").val(), который обычно является предпочтительным способом получения текущего значения выбранного параметра из выпадающего списка в jQuery. Атрибут "disabled" установлен на true, если в противном случае это значение "other" и false.