我正在使用表中的两个字段。我可以获取第一行值,然后添加第二行值,但无法获取第二行值。我需要如果我添加了多行,我可以使用JSON获得所有值。您能解决这些问题吗。
HTML格式:
<button class="add">Add</button>
<table class="orders-detail table table-striped table-bordered row-border hover" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody></tbody>
</table>
<button class="send">Send</button>
脚本:
$("document").ready(function(){
$(".add").click(function(){
var td_add="<tr><td><input type='text' id='name' class='name'></td><td><input type='text' id='age'></td></tr>";
$("tbody").append(td_add);
});
$(".send").click(function(){
var name=document.getElementById("name").value;
var age=document.getElementById("age").value;
var obj={
name:name,
age:age
};
alert(JSON.stringify(obj));
});
});
输出:我可以得到单行值。
{"name":"aravind","age":"42"}
最佳答案
我已经修正了你的密码,请检查一下。
$("document").ready(function() {
$(".add").click(function() {
var td_add = "<tr><td><input type='text' name='aa' id='name' class='name'></td><td><input type='text' name='bb' id='age'></td></tr>";
$("tbody").append(td_add);
});
$(".send").click(function() {
var asa = [];
$("input[name*='aa']").each(function(key, item) {
if (!asa[key]) asa[key] = {};
asa[key].calvalue = item.value;
});
$("input[name*='bb']").each(function(key, item) {
if (!asa[key]) asa[key] = {};
asa[key].calvalue2 = item.value;
});
alert(JSON.stringify(asa));
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<button class="add">Add</button>
<table class="orders-detail table table-striped table-bordered row-border hover" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody></tbody>
</table>
<button class="send">Send</button>