Скрыть и показать определенные элементы формы в отмеченном и непроверенном окне выбора?

Question

Скрыть и показать определенные элементы формы в отмеченном и непроверенном окне выбора?

0

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

HTML:

<input id="id_code_col" type="checkbox" name="code_col"></input>

СЦЕНАРИЙ:

$(document).ready(function(){
var selectBox = jQuery('#id_code_col');
selectBox.change(function () {
    if ($(this).val() == '1') {
      $('#id_FullColumn').show();
      $('#id_FirstColumn').hide();
      $('#id_SecondColumn').hide();

    }
    else {
      $('#id_FullColumn').hide();
      $('#id_FirstColumn').show();
      $('#id_SecondColumn').show();
    }
});
});

NB: я не могу добавить или удалить что-либо из html. Мне нужно сделать это со сценарием. Пожалуйста, помогите!

MHS 14 апр. 2014, в 07:53

Источник

Теги:

javascript

jquery

html

forms

6 ответов

2

selectBox.change(function () {
    if ($(this).is(':checked')) {
      $('#id_FullColumn').show();
      $('#id_FirstColumn').hide();
      $('#id_SecondColumn').hide();

    }
    else {
      $('#id_FullColumn').hide();
      $('#id_FirstColumn').show();
      $('#id_SecondColumn').show();
    }
});

Tuhin 14 апр. 2014, в 03:49

2

Изменить это

 if ($(this).val() == '1') {

к этому

 if (this.checked) {

Поскольку вам не нужно проверять значение на 1, так как ваш флажок не имеет значения, равного 1.

Таким образом, вы должны проверить состояние этого флажка с checked методом.

Jai 14 апр. 2014, в 03:40

2

Вы можете использовать .is() вместе с : checked selector, чтобы проверить, установлен ли ваш флажок или нет, поэтому попробуйте использовать:

if ($(this).is(':checked')) {

или чистый javascript, используя:

if(this.checked)

вместо:

if ($(this).val() == '1') {

Felix 14 апр. 2014, в 03:15

0

          $(function(){
                $('#id_code_col').change(function(){
                  if($(this.checked)){
                   alert('checked');
                    }else{
                     alert('unchecked');
                  }
                 });
           });

Varma 14 апр. 2014, в 09:11

0

$(document).ready(function () {
            var selectBox = jQuery('#id_code_col');
            selectBox.change(function () {
                if (this.checked) {
                    alert("checked");
                }
                else {
                    alert("unchecked");
                }
            });
        });

Sai Babu 14 апр. 2014, в 03:39

Ещё вопросы

Ehsan Sajjad · Accepted Answer · 2014-04-14T03-19-00.000Z

сделайте вот так:

if(this.checked)
{
// checked
}

else
{
// unchecked
}

для вашего дела:

   $(document).ready(function(){
    var selectBox = jQuery('#id_code_col');
    selectBox.change(function () {
        if (this.checked) {
          $('#id_FullColumn').show();
          $('#id_FirstColumn').hide();
          $('#id_SecondColumn').hide();

        }
        else {
          $('#id_FullColumn').hide();
          $('#id_FirstColumn').show();
          $('#id_SecondColumn').show();
        }
    });
    });