Question

当用户使用 jQuery 对其进行输入时，我想将 html输入中的字符插入表格单元格。下图说明了我需要实现的目标：

如果用户键入名称 TABLE ，则替换第一列中的星号。

这是我试过的：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
</head>


<body>
<script>
$(document).ready(function(){
$("#inputv").keyup(function(){
		var ttt = $("#inputv").val();
	
	 $("#test").html(ttt);
    
});
});

</script>
<style>
td {
    padding: 2px;
    background-color: #EEEEEE;
    border: 1px solid #000000;
    width: 20px;
    height: 20px;}

</style>
<input type="text" id="inputv">
<table width="200" border="1">
  <tr>
    <td id="test">*</td>
    <td  id="test">*</td>
    <td  id="test">*</td>
    <td  id="test">*</td>
    <td  id="test">*</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

＆＃13;

错误是它在第一个单元格中插入了整个单词例如TABLE ，而是将每个字符插入其自己的单元格

任何知道如何解决这个问题的人

Answer 1

你在表格中为每个td使用id我建议你使用一个类代替多个相同元素的id，因为id用于HTML中的单个元素。如果你想在同一个td中添加值时间你可以使用以下代码。 您的test ID已更改为test类。

$(document).ready(function(){
$("#inputv").keyup(function(){

     $("td.test").each(function(){
            $(this).html($("#inputv").val());
   });

});
});

对于单个列，您可以使用以下内容： 在那里我为您的td分配了test个ID。

$(document).ready(function(){
$("#inputv").keyup(function(){

   $("#test").html($("#inputv").val());
});
});

Answer 2

试试这个代码我很有帮助

$(document).ready(function() {
  $("#inputv").keyup(function() {

    $("td.test").each(function() {
      $(this).html($("#inputv").val());
    });

  });
});

td {
  padding: 2px;
  background-color: #EEEEEE;
  border: 1px solid #000000;
  width: 20px;
  height: 20px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title>Test</title>
</head>

<body>

  <input type="text" id="inputv">
  <table width="200" border="1">
    <tr>
      <td class="test">*</td>
      <td class="test">*</td>
      <td class="test">*</td>
      <td class="test">*</td>
      <td class="test">*</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </table>
</body>

</html>

Answer 3

试试这个你想要的东西。并且必须使用该类而不是id。

edittext.setAccentTypeface(typeface);

Answer 4

试试这段代码。我想这就是你想要的。希望它可以帮助你。

$(document).ready(function() {
  $("#inputv").keypress(function(e) {
    $('td').eq($("#inputv").val().length).html(String.fromCharCode(e.which));
  });
});

td {
  padding: 2px;
  background-color: #EEEEEE;
  border: 1px solid #000000;
  width: 20px;
  height: 20px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="inputv">
<table width="200" border="1">
  <tr>
    <td class="test">*</td>
    <td class="test">*</td>
    <td class="test">*</td>
    <td class="test">*</td>
    <td class="test">*</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

使用jQuery在keyup上将字符插入表格单元格

4 个答案: