2010-09-27 3 views
11

У меня есть флажок, и если я его помечаю, я хочу, чтобы текстовое поле включалось (отключено по умолчанию), и когда я отключаю флажок, я хочу, чтобы он снова отключился.Отключить/включить элемент с флажком и jQuery?

Я видел здесь jQuery Checkboxes как я могу переключить класс CSS, а здесь http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_disable.2Fenable_a_form_element.3F как переключаться между включенными и отключенными с помощью двух кнопок. Но как мне переключить статус отключенных/активированных текстовых полей, пометив/сняв флажок?

Заранее благодарен.

ответ

33
$(':checkbox').click(function(){ 
    $('input:text').attr('disabled',!this.checked) 
}); 

crazy demo

+1

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

+0

http://jsfiddle.net/FArMm/1/ обновленный пример от Рейгеля. – Tim

+0

@ Rao - если это ваш ярлык, вы беспокоитесь, проверьте [сумасшедшая демонстрация 2] (http://jsfiddle.net/FArMm/2/) – Reigel

6

Вы можете прикрепить обработчик изменений к флажку и включить/отключить текстовое поле со свойством checked.

$('#theCheckbox').change(function() { 
    $('#theTextfield').attr('disabled', this.checked); 
}); 

Пример: http://jsbin.com/oludu3/2

0

Вот страница, которая делает то, что вы ищете - это довольно минимален, но показывает, что вам нужно

<html> 
    <head> 
     <script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script> 
     <script> 
      $(document).ready(function() { 
       $("#testcheckbox").change(function() { 
        $("#testtextfield").attr("disabled", $(this).attr("checked")); 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <input type="checkbox" id="testcheckbox" /> 
     <input type="text" id="testtextfield" /> 
    </body> 
</html> 
1

@ Мартин - удалить текст в текстовых блоках, которые становятся отключенными, и снять флажок эс, что становится инвалидом - просто добавьте эту строку

$("#TextField_ID_name").val(""); 

и снимите флажок, вам нужно присвоить имя идентификатора с флажком , а затем добавить эту строку в Jquery

$("#chekcbox_ID_name").attr('checked',false) 

Надеется, что это помогает кто-то ... хотя я отвечаю на вопрос Мартинса через 2 года после его публикации :-)

0

С jQuery 1.6, метод .prop() должен использоваться для установки отключенного и отмеченного вместо метода .attr():

$('#theCheckbox').change(function() { 
    $('#theTextfield').prop('disabled', this.checked); 
}); 
0

показать и скрыть текстовое поле (# otherSection2) для ввода и другие варианты, когда последний флажок в тонированном таблице (#CheckBoxListList) из осины: CheckBoxList управления выбран

$("#CheckBoxListList input[type='checkbox']:last").on("click", function() { 

       if ($(this).is(":checked")) { 
        $("#otherSection2").show(); 
       } else { 
        $("#otherSection2").hide().find("input").val(null); 

       } 
      }); 
Смежные вопросы