2016-02-21 3 views
1

У меня проблема с моим javascript. Когда я изменяю combobox, все флажки включены. Я не хочу этого. Я хочу, чтобы только каждый флажок включал не все из них. Вот мой JS код:combobox change checkbox enable

<script> 
    function activ(){ 
    $("input[type='checkbox']").removeAttr("disabled"); 
    } 
</script> 
<script> 
    function disable(){ 
    $("input[type='checkbox']").attr("disabled", "disabled"); 
    } 
</script> 

А вот мой HTML код:

<html> 
    <body onload="disable();"> 
     <table> 
     <tr> 
      <th>SELECT</th> 
      <th>TAKE</th> 
     </tr> 
     <tr> 
      <td> 
       <select onchange="activ();"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" name="check1" /></td> 
     </tr> 
      <tr> 
      <td> 
       <select onchange="activ();"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" name="check1" /></td> 
      </tr> 
      <tr> 
      <td> 
       <select onchange="activ();"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" name="check1" /></td> 
     </tr> 
    </body> 
</html> 

Я надеюсь, что любое тело может помочь мне. Я очень благодарен за любую помощь .. Спасибо

ответ

0

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

<input type="checkbox" id="check1" /> 
<input type="checkbox" id="check2" /> 

Весь код:

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
     select{ 
    width: 100px; 
    display: block; 
    margin: 10px; 
} 
     </style> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("input[type='checkbox']").attr("disabled", "disabled"); 
$('.test').change(function(){ 
    var tmp = $(this).closest('tr').find("input[type='checkbox']").attr('id'); 
$('#'+tmp+'').removeAttr("disabled"); 
    }); 
}); 
</script> 
</head> 
<body> 
<table> 
     <tr> 
      <th>SELECT</th> 
      <th>TAKE</th> 
     </tr> 
     <tr> 
      <td> 
       <select class="test"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" id="check1" /></td> 
     </tr> 
      <tr> 
      <td> 
       <select class="test"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" id="check2" /></td> 
      </tr> 
      <tr> 
      <td> 
       <select class="test"> 
        <option>--Select--</option> 
        <option>Cars</option> 
        <option>Plane</option> 
        <option>Boat</option> 
       </select> 
      </td> 
      <td><input type="checkbox" id="check3" /></td> 
     </tr> 
     </table> 
</body> 
</html> 

как таковой.
Проверьте это, если оно удовлетворяет желаемому. plunker: Enable specific checkbox

Теперь, независимо от того, какой динамический идентификатор у вас есть для вашего флажка, он будет проверять изменения в вашем выборе и включать только связанные с ним соответствующие значения.

+0

Это работает, @Alex Rumba. – Mike

+0

, вы должны отметить его правильным братом, если он удовлетворит ваш вопрос. –

+0

Я хочу спросить вас @Alex Rumba. Что делать, если я хочу получить динамический флажок. Все предлагают.? – Mike