すべての列を変更する

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> 

に新しい - 私、これは私が求める機能は基本的に私はidと値を取得し、私が入力を無効にすることに依存しています、次の入力を無効にしているが、どうやら私は、有効または無効にすべてのtdは、私はあなたがtd.especialセレクタに一致するだけの最初の祖先を見つけるために$("#"+idSel).closest("td.especial")の代わり$("td.especial")を使用する必要があります

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

を働く行に一つだけではありません。

あなたの現在のコードは、与えられたセレクタ `td.especialにマッチするDOMに存在するものすべてにマッチしています。 .....