zoukankan      html  css  js  c++  java
  • jquery根据选择器进行页面赋值,封装赋值方法

    可以进行文本框赋值,文本域赋值,下拉列表赋值,单选框赋值,多选框赋值,

    传入对象,可以根据元素name进行比对赋值,不用每个进行单独赋值

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>springboot</title>
        <script type="text/javascript" src="../js/jquery.min.js"></script>
    </head>
    <body>
    
       <div id="test">
           <input type="text" name="a"/>
    
           <input name="b" value="1" type="radio"/>
           <input name="b" value="2" type="radio"/>
           <input name="b" value="3" type="radio"/>
    
           <input name="c"  type="checkbox" value="1"/>
           <input name="c" type="checkbox" value="2"/>
           <input name="c" type="checkbox" value="3"/>
    
           <textarea name="d"></textarea>
    
           <select name="e">
               <option>1</option>
               <option>2</option>
               <option>3</option>
           </select>
       </div>
    
    
    <script>
    
        let data={
            a:"123",
            b:"2",
            c:['1','2'],
            d:"1236",
            e:"2"
        }
    
        test2("#test",data);
        function test2(args,data){
            $(args+" input[type='text']").each(function () {
                let tags= $(this).attr("name");
                let val=data[tags];
                $("input[name="+tags+"]").val(val);
            })
    
            $(args+" input[type='radio']").each(function () {
                let tags= $(this).attr("name");
                let val=data[tags];
                $("input[name="+tags+"]").each(function () {
                    let val2=$(this).val()
                    if(val==val2){
                        $(this).prop( "checked",true);
                    }
                })
            })
    
            $(args+" input[type='checkbox']").each(function () {
                let tags= $(this).attr("name");
                let val=data[tags];
                console.log(val);
               $("input[name="+tags+"]").each(function () {
                    let val2=$(this).val();
                    if(val.indexOf(val2)>=0){
                         $(this).attr("checked",true);
                    }
                })
            })
    
            $(args+" textarea").each(function () {
                let tags= $(this).attr("name");
                let val=data[tags];
                $("textarea[name="+tags+"]").val(val);
            })
            $(args+" select").each(function () {
                let tags= $(this).attr("name");
                let val=data[tags];
                $("select[name="+tags+"]").val(val);
            })
    
        }
    
    </script>
    </body>
    </html>
  • 相关阅读:
    小小杨的影视空间
    关于励志的事情
    关于2020年的总结
    关于心情不好的时候
    关于我的2020年
    单链表基本操作的实现
    原型模式
    android—安卓系统文件目录结构
    android——apk安装文件的组成结构
    android——项目的组成结构
  • 原文地址:https://www.cnblogs.com/qq376324789/p/11955563.html
Copyright © 2011-2022 走看看