//assume I have the response data as follows:
var response[] = { blake,blake@gmail.com,fofehu45555,ontario,toronto }, {flake,flake@gmail.com,kokehu45555,ontario,toronto};
for(i=0; i<response.data.length; i++){
$("#table").append('<input type="checkbox"'"<tr class='tr'> <td> "+response.data[i].user_name+" </td> <td> "+response.data[i].userr_contact+" </td> <td> "+response.data[i].user_license+" </td> <td> "+response.data[i].userr_email+" </td> <td> "+response.data[i].state+" </td> <td> "+response.data[i].city);}
<button onclick="myfunction();">Go</button>
<table id="table" border=1>
<tr>
<th> Name </th>
<th> contact </th>
<th> license </th>
<th> email </th>
<th> state </th>
<th> city </th>
</tr>
</table>
我想将此复选框准确地附加到表中,以便我可以允许客户选择一些响应数据并通过单击按钮(onclick)再次发出新请求。
我为此苦苦挣扎的棘手部分是我想获取存储在变量/数组变量中的所选复选框的电子邮件地址
答案 0 :(得分:1)
假设我的响应数据如下
没什么...因为我觉得这是你的问题。
否则,答案是:获取产生这种格式错误的“响应”的服务器脚本并进行修复。
所以我在那里做了很多工作,向您展示了一个可行的示例。
如注释中所述,response
声明(作为起点)无效。我以一种“常见”的方式构造了它……这是一个包含对象数组的对象。
对象具有属性名称...您正试图在jQuery附录中引用该名称。所以我加了他们。
然后,在附录中,将复选框放置在tr
之外...不好。我将其放置在名称单元中...但是我希望为其添加一个表列。您决定。
您还对该字符串附加了一些引号。
$("#goBtn").on("click",function(){
//assume I have the response data as follows:
var response = {
data:[
{
user_name: "blake",
user_email: "blake@gmail.com",
user_contact: "fofehu45555",
state: "ontario",
city: "toronto",
user_license: ""
},
{
user_name: "flake",
user_email: "flake@gmail.com",
user_contact: "kokehu45555",
state: "ontario",
city: "toronto",
user_license: ""
}
]
};
for(i=0; i<response.data.length; i++){
$("#table").append("<tr class='tr'> <td> <input type='checkbox'> "+response.data[i].user_name+" </td> <td> "+response.data[i].user_contact+" </td> <td> "+response.data[i].user_license+" </td> <td> "+response.data[i].user_email+" </td> <td> "+response.data[i].state+" </td> <td> "+response.data[i].city);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="goBtn">Go</button>
<table id="table" border=1>
<tr>
<th> Name </th>
<th> contact </th>
<th> license </th>
<th> email </th>
<th> state </th>
<th> city </th>
</tr>
</table>
答案 1 :(得分:0)
假设您的回复采用以下格式:
var response = [
{
user_name: 'blake',
user_email: 'blake@gmail.com',
user_licence: 'fofehu45555',
user_state: 'ontario',
user_city: 'toronto'
},
{
user_name: 'flake',
user_email: 'flake@gmail.com',
user_licence: 'kokehu45555',
user_state: 'ontario',
user_city: 'toronto'
}
];
创建所需内容的一种更具可读性的方法是:
response.forEach(function(user) {
var tr = $('<tr/>');
var nameTd = $('<td/>', {text: user.user_name});
var checkbox = $('<input />', { type: 'checkbox', value: user.user_email }).prependTo(nameTd);
nameTd.appendTo(tr);
var contactTd = $('<td/>', {text: user.user_contact}).appendTo(tr);
var licenceTd = $('<td/>', {text: user.user_licence}).appendTo(tr);
var emailTd = $('<td/>', {text: user.user_email}).appendTo(tr);
var stateTd = $('<td/>', {text: user.user_state}).appendTo(tr);
var cityTd = $('<td/>', {text: user.user_city}).appendTo(tr);
$('table tbody').append(tr);
});
您的html应该看起来像这样:
<html>
<body>
<table>
<thead>
<tr>
<th> Name </th>
<th> contact </th>
<th> license </th>
<th> email </th>
<th> state </th>
<th> city </th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
然后,您可以像这样获得被检查用户的电子邮件:
var selected = $('input:checkbox:checked');
var emails = [];
selected.each(function(){
emails.push($(this).val());
});