Есть ли способ отключить все поля (textarea / textfield / option / input / checkbox / submit и т. д.) в форме, сообщив только имя родительского div в jquery / javascript?
Есть ли способ отключить все поля (textarea / textfield / option / input / checkbox / submit и т. д.) в форме, сообщив только имя родительского div в jquery / javascript?
Ответы:
Попробуйте использовать :input
селектор вместе с родительским селектором:
$("#parent-selector :input").attr("disabled", true);
div
и все. Если бы мне дали больше информации, я мог бы найти более эффективное решение.
$('#mydiv').find('input, textarea, button, select').attr('disabled','disabled');
$('#mydiv').find('input, textarea, button')
.
Для JQuery 1.6+, использовать .prop()
вместо .attr()
,
$("#parent-selector :input").prop("disabled", true);
или
$("#parent-selector :input").attr("disabled", "disabled");
$(document).ready(function () {
$('#chkDisableEnableElements').change(function () {
if ($('#chkDisableEnableElements').is(':checked')) {
enableElements($('#divDifferentElements').children());
}
else {
disableElements($('#divDifferentElements').children());
}
});
});
function disableElements(el) {
for (var i = 0; i < el.length; i++) {
el[i].disabled = true;
disableElements(el[i].children);
}
}
function enableElements(el) {
for (var i = 0; i < el.length; i++) {
el[i].disabled = false;
enableElements(el[i].children);
}
}
Просто эта строка кода отключит все элементы ввода
$('#yourdiv *').prop('disabled', true);
Как насчет достижения этого, используя только атрибут HTML «отключен»
<form>
<fieldset disabled>
<div class="row">
<input type="text" placeholder="">
<textarea></textarea>
<select></select>
</div>
<div class="pull-right">
<button class="button-primary btn-sm" type="submit">Submit</button>
</div>
</fieldset>
</form>
Просто включив отключенный в fieldset все поля внутри этого fieldset отключаются.
$('fieldset').attr('disabled', 'disabled');
Я использую функцию ниже в различных точках. Работает в элементах div или button в таблице, если используется правильный селектор. Просто ": кнопка" не будет повторно для меня.
function ToggleMenuButtons(bActivate) {
if (bActivate == true) {
$("#SelectorId :input[type='button']").prop("disabled", true);
} else {
$("#SelectorId :input[type='button']").removeProp("disabled");
}
}
Следующее отключит все входные данные, но не сможет сделать это для класса btn, а также добавит класс для перезаписи отключить css.
$('#EditForm :input').not('.btn').attr("disabled", true).addClass('disabledClass');
класс CSS
.disabledClass{
background-color: rgb(235, 235, 228) !important;
}
Для меня принятый ответ не сработал, так как у меня были некоторые скрытые поля asp net, которые также были отключены, поэтому я решил отключить только видимые поля
//just to save the list so we can enable fields later
var list = [];
$('#parent-selector').find(':input:visible:not([readonly][disabled]),button').each(function () {
list.push('#' + this.id);
});
$(list.join(',')).attr('readonly', true);
Используйте класс CSS, чтобы предотвратить редактирование элементов Div
CSS:
.divoverlay
{
position:absolute;
width:100%;
height:100%;
background-color:transparent;
z-index:1;
top:0;
}
JS:
$('#divName').append('<div class=divoverlay></div>');
Или добавьте имя класса в тег HTML. Это предотвратит редактирование элементов Div.
Только тип текста
$(".form-edit-account :input[type=text]").attr("disabled", "disabled");
Только тип пароля
$(".form-edit-account :input[type=password]").attr("disabled", "disabled");
Только тип электронной почты
$(".form-edit-account :input[type=email]").attr("disabled", "disabled");
Если ваша форма внутри div
просто содержит элементы ввода формы, тогда этот простой запрос отключит каждый элемент внутри form
тега:
<div id="myForm">
<form action="">
...
</form>
</div>
Тем не менее, он также отключит другие элементы form
, кроме ввода , поскольку его эффекты будут видны только для элементов типа ввода, поэтому подходят в основном для всех типов форм!
$('#myForm *').attr('disabled','disabled');
readOnly
, а не отключенными.