j查询检查复选框是否被选中,然后向输入字段添加值

jQuery Check if Checkbox is Checked, then Add Value to Input Field

本文关键字:然后 输入 字段 添加 检查 查询 复选框 是否      更新时间:2023-09-26

我有一个购物车结帐页面,我正在尝试添加一个"礼物"选项。需要发生的情况:选中"将订单作为礼物发送"复选框后,需要为隐藏的输入字段分配一个值,以便将信息移动到确认页面和各种收据上。

.HTML:

<h3>Send Order As Gift</h3>
<ul>
    <li class="fc_row fc_gift"><label for="gift" class="fc_pre">This is a gift, 
    please do not include a receipt.</label>
    <input type="checkbox" name="gift" id="gift" class="checkbox" value="" />
    <input type="hidden" name="Gift" id="gift-true" value="" /></li>
    <script type="text/javascript">
    $(document).ready(function(){
        $("#gift-true").input( $('#edit-checkbox-id').is(':checked').val() + "Yes"); 
    });​                
    </script>
    </li>
    <li class="fc_row fc_gift_message"><label for="Gift Message">Include a message 
    (limit 100 characters):</label>
    <textarea name="Gift Message" cols="50" rows="3" maxlength="100"></textarea>
    </li>
</ul>

每当复选框更改时,您都必须更新隐藏字段:

$(function(){
    $('#gift').change(function() {
        $("#gift-true").val(($(this).is(':checked')) ? "yes" : "no");
    });
});
使用 jQuery

.val() 设置输入元素的值。 jQuery .is()返回一个布尔值,因此您必须检查它是否true(使用 if 语句或如下所示的三元运算符),然后有条件地更新该值。此外,每当选中/取消选中该框时,都应更新此值:

$(document).ready(function(){
    $('#edit-checkbox-id').change(function() {
        $("#gift-true").val( this.checked ? "Yes" : "" );
    }
});​

此外,如果您的复选框是:

<input type="checkbox" name="gift" id="gift" class="checkbox" value="" />

适当的 id 选择器是 $('#gift') ,而不是

$('#edit-checkbox-id')
$('#edit-checkbox-id').is(':checked')根据

复选框状态返回布尔值真/假。因此,您应该将其用作条件,并决定使用val jQuery方法设置值的内容。试试这个。

$("#gift-true").val( $('#edit-checkbox-id').is(':checked') ? "Yes": "No" ); 

你可以使用CSS Pseudo-classe,例如:

var checked=$('input[id="#gift-true"]:checked').length;
var isTrue=false;
if(checked)
    isTrue=true;
else
    isTrue=false;