我有一个表,我想在其中添加第一行第三列中的多个输入。如果我单击添加pk1按钮,它不会被添加到特定的td中,即<td class=partition1>
使用jQuery或Javascript的任何解决方案?输入必须以display:block模式而不是inline模式添加。这是使用Jquery或javascript处理此问题的最简单方法?
$('.add-pkey1').on('click','.partition1' ,function(){
var t0 = $('.partition1').append('<input type="text" name="input1" value="test" />');
$('#table-id').append(t0);
})
table {
border-collapse: collapse;
margin: 1em;
}
thead {
background-color: lightblue;
}
td,
th {
border: solid grey 1px;
padding: 1em;
text-align: center;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table
id="table-id"
>
<thead >
<tr>
<th colspan="6" class="text-center">
<span>Source : </span>
</th>
</tr>
<tr>
<th>input1</th>
<th>input2</th>
<th class="partition1">Partition1</th>
<th class="partition2">
Partition2
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input
id="input1"
type="text"
name="input1"
/>
</td>
<td>
<input
id="input2"
type="text"
name="input2"
/>
</td>
<td class="partition1">
<input
type="text"
name="partition"
/>
</td>
<td class="partition2">
<input
type="text"
name="partition2"
/>
</td>
</tr>
</tbody>
</table>
<button class="add-pkey1">add pk1</button>
正如@Taplar之前所说,您的代码有多个问题,因此我不会一一讨论。但我会提到一些著名的。