zoukankan      html  css  js  c++  java
  • jquery 获取一组元素的选中项

    做表单提交时,如果现在还在用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名"]'));
  • 相关阅读:
    MySQL事务学习-->隔离级别
    ssh升级
    通过普通用户向各个节点服务器分发文件到各个目录
    parted在2T以上硬盘上分区操作
    时间同步出现ntpdate[1788]: the NTP socket is in use, exiting
    kvm解决1000M网卡问题
    mysql主从同步问题解决汇总
    ....
    iOS App Icon图标 尺寸规范
    SpringMVC注解配置
  • 原文地址:https://www.cnblogs.com/phpyangbo/p/6128389.html
Copyright © 2011-2022 走看看