如何根据输入字段禁用 <td>

Question

超文本标记语言

<input type="text" name="haha"  id="X" >

<td style="width: 5%;" class="haha"><svg class="teeth svg" id="svg"

 width="400px" height="300px" viewBox="0 0 400 300" preserveAspectRatio="xMidYMid meet">

    <!-- upper right 8 -->

    <g id="molar-group" class="molar">

        <rect x="75" y="75" stroke="black" id="disto-occlusal" style="stroke-width: 5px;" width="125" height="150" fill="white"/>

        <rect x="200" y="75" stroke="black" id="mesio-occlusal" style="stroke-width: 5px;" width="125" height="150" fill="white"/>

 </g>

</svg></td>

JavaScript：

 $(function () {

  ($("#X").keyup(function (){

      if ($("#X").val() == 'X') {

          ('.haha').prop('disabled',true);

      }else{

          ('.haha').prop('disabled', false);

      }

  })

 };

);

如何根据输入字段禁用 td class="haha"。例如，如果我在输入字段中输入 X，它会自动禁用 td class="haha" 这可能吗？

Answer 1

我不确定您的意思，disable td因为禁用属性仅适用于<input> tag。但是您可以根据您的情况执行添加和删除类之类的操作。$("#X").keyup(function (){      if ($("#X").val() == 'X') {          $('.haha').addClass('unselectable');      }else{          $('.haha').removeClass('unselectable');      }  })#svg{ border : 1px solid green;}.unselectable{     background-color: #ddd;     cursor: not-allowed;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script><table>  <tr>     <input type="text" name="haha" placeholder="enter X to see result" id="X" ><td style="width: 5%;" class="haha"><svg class="teeth svg" id="svg" width="400px" height="300px" viewBox="0 0 400 300" preserveAspectRatio="xMidYMid meet">    <!-- upper right 8 -->    <g id="molar-group" class="molar">        <rect x="75" y="75" stroke="black" id="disto-occlusal" style="stroke-width: 5px;" width="125" height="150" fill="white"/>        <rect x="200" y="75" stroke="black" id="mesio-occlusal" style="stroke-width: 5px;" width="125" height="150" fill="white"/> </g></svg></td>  </tr></table>