jquery 获取一组元素的选中项 - 函数jquery获取复选框值jquery获取单选按钮值

Posted 2020-08-21 鱼塘总裁

做表单提交时，如果现在还在用form提交，用户体验很差，所以一般使用ajax提交。

其中需要获取每个表单输入元素的值，获取的时候像文本框这些还好说，Jquery提供了 .val() 方法，获取很方便，但是获取复选框和单选按钮的值确比较麻烦。

今天闲来无事封装了一个函数，以后获取复选框和单选按钮的值就只需要调用这个函数，传入jquery选择器就可以了，下面附上函数。

函数

/**
 * 获取单个或一组输入元素的选中项
 * 传入Jquery选择器
 * 支持：text，返回：文本
 * 支持：hidden，返回：文本
 * 支持：password，返回：文本
 * 支持：textarea，返回：文本
 * 支持：select，返回：1
 * 支持：checkbox，返回：1,2,3,4,5,6
 * 支持：radio，返回：1
 * 20161203
*/
function get_choose(choose){
    var choose_size    =    $(choose).size();
    var choose_type    =    $(choose+‘:eq(0)‘).attr(‘type‘);
    var return_text    =    ‘‘;
    for(var i=0;i<choose_size;i++){
        //如果是复选框或者单选按钮需要做特殊处理
        if(choose_type==‘checkbox‘ || choose_type==‘radio‘){
            //判断元素是否被选中，选中才处理
            if($(choose+‘:eq(‘+i+‘)‘).is(‘:checked‘)){
                //如果复选框被选中，获取其值，继续执行获取下一个
                if(choose_type==‘checkbox‘){
                    return_text    +=    (return_text!=‘‘)?‘,‘+$(choose+‘:eq(‘+i+‘)‘).val():$(choose+‘:eq(‘+i+‘)‘).val();
                }
                //如果是单选按钮被选中，获取其值，终止循环
                else if(choose_type==‘radio‘){
                    return_text    +=    $(choose+‘:eq(‘+i+‘)‘).val();
                    break;
                }
                else{
                    break;
                }
            }
        }
        //其他元素属性，直接返回其value值，终止循环
        else{
            return_text    +=    $(choose+‘:eq(0)‘).val();
            break;
        }
    }
    return return_text;
}

调用方式

alert(get_choose(‘[name="文本框name名"]‘));
alert(get_choose(‘[name="文本域name名"]‘));
alert(get_choose(‘[name="多选框name名"]‘));
alert(get_choose(‘[name="单选框name名"]‘));