js 关于checkbox相关操作

最新推荐文章于 2024-04-09 16:10:23 发布

原创最新推荐文章于 2024-04-09 16:10:23 发布 · 286 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#checkbox #表单 #js #javascript

js 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何使用JavaScript处理表单中的Checkbox选择状态及文本输入值，包括收集已选中的Checkbox并组合成字符串，以及根据Checkbox的选择更新相关文本字段。

1.form表单提交一组checkbox

$("#gift_is_rand input[type=checkbox]").click(function(){
    var giftRandObj = $("#gift_is_rand input[type=checkbox]");
    var len = giftRandObj.length;
    var giftRand = '';
    var count = 1;
    for (var i = 0; i < len; i++) {
        if ($(giftRandObj[i]).is(':checked')) {
            $("#giftRand_"+count).attr("value",1);
        } else {
            $("#giftRand_"+count).attr("value",0);
        }

        giftRand += parseInt($(giftRandObj[i]).attr('value')) + '#';
        count++;
    }
    $("#giftIsRand").attr('value',giftRand);
});

2.form表单提交多个checkbox、文本

$('input[name=salePoint]').click(function(){
    $("#saleProPoint").attr('value','');
    $("#totalMoney").attr('value','');
    var salePointStr = '';
    var totalMoney = 0;
    var price ='';
    var des ='';
    var obj = $('input[name=salePoint]');
    var len = obj.length;
    var count = 1;
    for (var i = 0; i < len; i++) {
        if ($(obj[i]).is(':checked')) {
            price = parseInt($("#money_"+parseInt(count)).attr('value'));
            des = $("#description_"+parseInt(count)).attr('value');
            totalMoney += price;

            if(price && des){
                salePointStr += $(obj[i]).attr('value') + '#'+price+'#'+des+'@';
            }
        }
        count++;
    }
//    salePointStr = salePointStr.substring(0, salePointStr.length - 1);
    $("#saleProPoint").attr('value',salePointStr);
    $("#totalMoney").attr('value',totalMoney);
})