使用 jquery 同时设置 td 标签和输入标签的文本和值

Question

我正在尝试同时为td标签和input标签设置text和value。但是单击按钮后，td标签被填充数据并且输入标签消失。

最好的解决方案是什么？

function myfunction() {
  $("#sel").val("Kannan");
  $(".sel").html("Kannan");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1">
  <tr>
    <th>name</th>
  </tr>
  <tr>
    <td class="sel">
      <input type="text" id="sel">
    </td>
  </tr>
</table>
<button onClick="myfunction();">click</button>

Answer 1

你需要删除JS中不必要的行

function myfunction() {
  $("#sel").val("Kannan");
  //$(".sel").html("Kannan"); Remove this line.
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1">
  <tr>
    <th>name</th>
  </tr>
  <tr>
    <td class="sel">
      <input type="text" id="sel">
    </td>
  </tr>
</table>
<button onClick="myfunction();">click</button>