zoukankan      html  css  js  c++  java
  • ajax无刷新方式对form表单进行赋值!

    /**
     * 把json数据填充到from表单中
     */
    <form id="editForm" action="user.php">
        用户名:<input type="text" name="usrname" /><br/>
        地址:<input type="text" name="address" /><br/>
        性别:<input type="radio" name="sex" value="0" />&nbsp;
         <input type="radio" name="sex" value="1" /><br/> 爱好:<input type="checkbox" name="hobby[]" value="sing" />唱歌&nbsp; <input type="checkbox" name="hobby[]" value="code" />写代码&nbsp; <input type="checkbox" name="hobby[]" value="trance" />发呆
    </form>

    以下是JS方法用于对form表单进行赋值(通用方法)

    $.fn.formEdit = function(data){
        return this.each(function(){
            var input, name;
            if(data == null){this.reset(); return; }
            for(var i = 0; i < this.length; i++){  
                input = this.elements[i];
                //checkbox的name可能是name[]数组形式
                name = (input.type == "checkbox")? input.name.replace(/(.+)[]$/, "$1") : input.name;
                if(data[name] == undefined) continue;
                switch(input.type){
                    case "checkbox":
                        if(data[name] == ""){
                            input.checked = false;
                        }else{
                            //数组查找元素
                            if(data[name].indexOf(input.value) > -1){
                                input.checked = true;
                            }else{
                                input.checked = false;
                            }
                        }
                    break;
                    case "radio":
                        if(data[name] == ""){
                            input.checked = false;
                        }else if(input.value == data[name]){
                            input.checked = true;
                        }
                    break;
                    case "button": break;
                    default: input.value = data[name];
                }
            }
        });
    };

    调用方式:

    $json = { "usrname":"张三", "address":"湖北钟祥", "sex": "1", "hobby":["sing", "trance"]};

    $('#editForm').formEdit($json);

    调用代码解释说明:

    $(form表单).formEdit(json数据);
    json数据说明:基本格式{inputname: value}, 具体类型{"text":"aaa", "checkbox":[1,2,3], "radio":"10"}

  • 相关阅读:
    js中细小点
    被 idea 坑了的记录篇
    Spring 读写分离
    Java反射机制
    Spring AOP
    java Beanutils.copyProperties( )用法
    java List 数组删除元素
    java 中序列化(Serializable)
    webpack 入门
    使用zxing生成彩色或带图片的二维码
  • 原文地址:https://www.cnblogs.com/kingfly/p/4078543.html
Copyright © 2011-2022 走看看