改变TD变化的所有列

Question

我有一个td禁用输入，基于在td选择的选择，td目标是下一个，但是当我选择一个选项，它改变了这一切，在未来td该列。在此u_u

<table id="tabla"> 
<!-- Cabecera de la tabla --> 
    thead> 
    <tr> 
    <th>Nombre</th> 
    <th>Apellidos</th> 
    <th>Sexo</th> 
    <th>&nbsp;</th> 
    </tr> 
</thead> 
    <tbody> 
    <tr> 
     <td class="especial"> 
     <select id="mySelect" onchange="funcSelect()" name="inmueble_psesion" class="browser-default"> 
       <option value="1">PROPIO</option> 
       <option value="2">RENTADO</option> 
       <option value="3">COMODATO</option> 
       <option value="4">*OTRO</option> 
     </select> 
     </td> 
     <td><input type="text" name="" disabled></td> 
     <td><input type="text" name="" value="3" ></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td class="especial"> 
     <select id="mySelect2" onchange="funcSelect()" 
     name="inmueble_psesion" class="browser-default"> 
       <option value="1">PROPIO</option> 
       <option value="2">RENTADO</option> 
       <option value="3">COMODATO</option> 
       <option value="4">*OTRO</option> 
     </select> 
     </td> 
     <td><input type="text" name="" disabled></td> 
     <td><input type="text" name="" value=""></td> 
     <td><input type="text" name="" value=""></td> 
    </tr> 
    </tbody> 
</table> 

I'm新的，这是我要求的功能禁用下一个输入，基本上我获得的ID和价值，取决于我禁止输入，但显然我禁用或启用所有的TD不只是一个排在我工作

function funcSelect(){ 
    var idSel = $("select").attr("id"); 
    console.log(idSel); 
    var valSel = $("#"+idSel).val(); 
    var id = "#"+idSel; 
    console.log(id); 
    console.log(valSel); 
    if(valSel === "4"){ 
    $("td.especial").next("td").children().removeAttr("disabled"); 
    }else{ 
    $("td.especial").next("td").children().attr("disabled", "disabled"); 
    } 
} 

Answer 1

JavaScript不工作，这way.Here是一个工作版本的代码，你.....另外，您不必使用任何内联函数来得到这个工作.....

HTML: 

<table id="tabla"> 
    <!-- Cabecera de la tabla --> 
     <thead> 
    <tr> 
    <th>Nombre</th> 
    <th>Apellidos</th> 
    <th>Sexo</th> 
    <th>&nbsp;</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
    <td class="especial"> 
    <select id="mySelect" name="inmueble_psesion" class="browser-default"> 
      <option value="1">PROPIO</option> 
      <option value="2">RENTADO</option> 
      <option value="3">COMODATO</option> 
      <option value="4">*OTRO</option> 
    </select> 
    </td> 
    <td><input type="text" name="" disabled></td> 
    <td><input type="text" name="" value="3" ></td> 
    <td></td> 
</tr> 
<tr> 
    <td class="especial"> 
    <select id="mySelect2" 
    name="inmueble_psesion" class="browser-default"> 
      <option value="1">PROPIO</option> 
      <option value="2">RENTADO</option> 
      <option value="3">COMODATO</option> 
      <option value="4">*OTRO</option> 
    </select> 
    </td> 
    <td><input type="text" name="" disabled></td> 
    <td><input type="text" name="" value=""></td> 
    <td><input type="text" name="" value=""></td> 
</tr> 
</tbody> 
</table> 

使用Javascript/jQuery的：

$(document).on('change', 'select', function(event) { 
    var val = $(this).val(); 
    if (val == 4) { 
     $(this).parent().next('td').children().removeAttr('disabled'); 
    }else{ 
     $(this).parent().next('td').children().attr('disabled', 'disabled'); 
    } 
}); 

Answer 2

您应该使用$("#"+idSel).closest("td.especial")而不是$("td.especial")找到刚才始祖匹配td.especial选择。

您当前的代码只是匹配DOM匹配给定选择器`td.especial中的所有内容。