jQuery 使用 .each() 遍历选中的复选框和 .append 数据
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12124938/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using .each() to loop through checked checkboxes and .append data
提问by Chris J
I have a series of rows in a table each with different values (prices) and each row has a checkbox. This table is generated through a PHP loop.
我在表中有一系列行,每行都有不同的值(价格),每行都有一个复选框。该表是通过 PHP 循环生成的。
echo "<table border='0' cellpadding='10' id='booking-list'><tr>";
echo "<th>Booking ID</th><th>Customer ID</th><th>Start Date</th><th>Course Name</th><th>Amount Due</th><th>Date Payment Due</th><th>Add to basket</th></tr>";
$x = 0;
while ($row = mysql_fetch_assoc($query)) {
$balance = $row['price'] - $row['deposit'];
echo "<td>" .$row['booking_id']. "</td><td>" .$cust_id. "</td><td>" .$row['start_date']. "</td><td>" .$row['name']. "</td><td>" .$balance. "</td><td>" .$row['balance_due_date']. "</td><td><input type='checkbox' name='' value='" .$x. "' /></td></tr>";
$x++;
}
echo "</tr><table>";
For every check box that is checked, I'd like to add (.append
) the specific value ($balance
) to a form
input field. The appending part seems to be working but I'm not sure how to loop through each checked checkbox in jQuery to grab the value I need.
对于选中的每个复选框,我想将 ( .append
) 特定值 ( $balance
) 添加到form
输入字段。附加部分似乎正在工作,但我不确定如何遍历 jQuery 中每个选中的复选框以获取我需要的值。
function(){
$('#booking-list input:checkbox').change(
function(){
if ($(this).is(':checked')) {
$('<input />').attr({
type: 'text',
id: 'foo',
name: 'bar',
value: '<?php echo $balance; ?>'
}).appendTo('#paypal-form form').text($(this).val());
} else {
$('#paypal-form input:contains('+$(this).val()+')').remove();
}
});
Right now, I can only get the last $balance
value generated.
现在,我只能获取$balance
生成的最后一个值。
Thanks.
谢谢。
回答by sabithpocker
To select all checked checkboxes you can do:
要选择所有选中的复选框,您可以执行以下操作:
$('#booking-list input:checkbox:checked').each(function(){
$(this).doSomething();//this is the checked checkbox
});
回答by Guffa
You are using $balance
after the loop, that's why you are only getting the last value.
您$balance
在循环之后使用,这就是为什么您只获得最后一个值的原因。
To use the value directly in the event handler, you would have to create a separate event handler for each checkbox inside the loop. Instead you can put the balance value in the data for the checkbox:
要直接在事件处理程序中使用该值,您必须为循环内的每个复选框创建一个单独的事件处理程序。相反,您可以将余额值放入复选框的数据中:
<input type='checkbox' name='' value='" .$x. "' data-balance='" .$balance. "' />
Then you can use it in the event handler:
然后你可以在事件处理程序中使用它:
value: $(this).data('balance')
Side note: Right now you only have code for adding inputs, so if someone checks something and then unchecks it, the input is still there.
旁注:现在你只有添加输入的代码,所以如果有人检查了某些东西然后取消选中它,输入仍然存在。
回答by Jason Dam
I think maybe it's because you're reusing the id for the input. Have you tried putting the id of the input as the $cust_id?
我想也许是因为你在输入中重用了 id。您是否尝试将输入的 id 作为 $cust_id ?
syntax of each below:
下面每个的语法:
$('selector').each(function (index, currentObject) {
// index starts with 0
$(currentObject).doSomething();
});
回答by Hossein
You can call this code on checkbox onClick
event too.
您也可以在复选框onClick
事件上调用此代码。
$(':checkbox:checked').each(function() {
});