2014-02-09 4 views
2

Я пытаюсь использовать jquery, чтобы отключить элемент формы после щелчка на флажке, однако он, похоже, не работает. Кто-нибудь может понять, что случилось?Отключить элемент формы с jquery

$('name="globallyAddTime"').click(function() { 
if ($(this).attr('checked')) { 
     $('name="addedQuantity[]"').attr('disabled', true); 
    } else { 
     $('name="addedQuantity[]"').removeAttr('disabled'); 
    } 
}); 

Вот ссылка на jsfiddle

http://jsfiddle.net/pocockn/bwmv7/4/

+0

также ваша скрипка не JQuery Framework – stackErr

+0

использовать .prop ('отключен', правда) /. Проп ('отключено', ложь) вместо атра/removeAttr. –

ответ

2

Селектор атрибут должен быть, как этот [attr=value]

$('[name="globallyAddTime"]').change(function() { 
if ($(this).prop('checked')) { 
     $('[name="addedQuantity[]"]').attr('disabled', true); 
    } else { 
     $('[name="addedQuantity[]"]').removeAttr('disabled'); 
    } 
}); 

Fiddle Demo

Вы можете сделать это упрощено следующим

$('[name="globallyAddTime"]').change(function() { 
    $('[name="addedQuantity[]"]').prop('disabled', this.checked); 
}); 

Fiddle Demo

1

При выборе атрибута, вы должны использовать []:

$('[name="globallyAddTime"]').click(function() { 
    if ($(this).attr('checked')) { 
     $('[name="addedQuantity[]"]').attr('disabled', true); 
    } else { 
     $('[name="addedQuantity[]"]').removeAttr('disabled'); 
    } 
}); 
2

Попробуйте это (использование проп вместо Attr)

$('name="globallyAddTime"').click(function() { 
if ($(this).prop('checked')) { 
     $('[name="addedQuantity[]"]').attr('disabled', true); 
    } else { 
     $('[name="addedQuantity[]"]').removeAttr('disabled'); 
    } 
}); 

атр Дон» t вернуть текущее состояние флажка.

И у вас есть ошибка в выборе имени. Нужна [name="addedQuantity[]"]

+0

Также флажок [name = "globallyAddTime"] для ввода. – xmarston

+0

Для jQuery 1.6+ используйте 'prop' вместо' attr' –

0

Использование:

$('[name="globallyAddTime"]').click(function() { 
    if ($(this).prop('checked')) { 
     $('#addedQuantiy_1').attr('disabled', true); 
    } else { 
     $('#addedQuantiy_1').removeAttr('disabled'); 
    } 
}); 

Working Fiddle

0

Я получил его.

<div id="addIngredient"> 
         <p> 
          <input type="text" id="ingredient_1" name="ingredient[]" value="" placeholder="Ingredient" /> 
          <input type="text" id="quantity_1" name="quantity[]" value="" placeholder="Quantity" /> 
          <select id="selectQuantity_1" name="quantityType[]"> 
           <option value="grams">Grams</option> 
           <option value="ounces">Ounces</option> 
           <option value="Pounds">Pounds</option> 
          </select> 
          <input type="text" id="alternative_1" name="alternative[]" value="" placeholder="Alternative Ingredient" /> 
          <input type="text" id="addedQuantiy_1" name="addedQuantity" value="" placeholder="Quantity per extra person" /> 

          <a href="#" id="addNewIngredient">Add Ingredient</a> 
         </p> 
        </div> 


<h2>Added Time</h2> 
        <input type="checkbox" name="globallyAddTime" id="global" value="Global" /> 
        <label>Increase Quantites Proportionally to Portion Number</label> 
       </div> 



<script type="text/javascript" src="script/jquery-1.11.0.min.js"></script> 
<script> 
$('#global').change(function() { 
     if($(this).is(":checked")) { 
      $('input[name=addedQuantity]').attr('disabled', true); 
    } else { 
     inputs.removeAttr('disabled'); 
    } 
    }); 
</script> 
+0

. возможно, вы можете избежать использования '[]' в своем имени ввода. это нисколько не повредило бы вам.^_ ^ – yul757

Смежные вопросы