Отключить все элементы формы внутри div

Есть ли способ отключить все поля (textarea/textfield/option/input/checkbox/submit и т.д.) в форме, указав только имя родительского div в jquery/javascript?

Ответ 1

Попробуйте использовать селектор :input вместе с родительским селектором:

$("#parent-selector :input").attr("disabled", true);

Ответ 2

$('#mydiv').find('input, textarea, button, select').attr('disabled','disabled');

Ответ 3

Для jquery 1.6+ используйте .prop() вместо .attr(),

$("#parent-selector :input").prop("disabled", true);

или

$("#parent-selector :input").attr("disabled", "disabled");

Ответ 4

    $(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);
        }
    }

Ответ 5

Я использую функцию ниже в разных точках. Работает в элементе div или кнопки в таблице, если используется правый селектор. Просто ": кнопка" не будет повторно активирована для меня.

function ToggleMenuButtons(bActivate) {
    if (bActivate == true) {
        $("#SelectorId :input[type='button']").prop("disabled", true);
    } else {
        $("#SelectorId :input[type='button']").removeProp("disabled");
    }
}

Ответ 6

Просто эта строка кода отключит все элементы ввода

$('#yourdiv *').prop('disabled', true);

Ответ 7

После этого будет отключен весь вход, но он не сможет использовать класс btn, а также добавлен класс для перезаписывания отключенного css.

$('#EditForm :input').not('.btn').attr("disabled", true).addClass('disabledClass');

css class

.disabledClass{
  background-color: rgb(235, 235, 228) !important;
}

Ответ 8

Для меня принятый ответ не работал, поскольку у меня было несколько скрытых скрытых полей 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);

Ответ 9

Используйте класс 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.

Ответ 10

Только тип текста

$(".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");

Ответ 11

Как насчет достижения этого, используя только атрибут 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 отключаются.