zoukankan      html  css  js  c++  java
  • jq真正清空表单数据(亲测 好用)

    工作中遇到复杂的表单,需要一次清空挺麻烦的,字段太多,不仅包含input,还有select,radio,checkbox

    于是乎,想一次清空也挺麻烦的,所以整理代码如下,供大家参考学习(本人也是菜鸟一枚,正在努力学习中......)

    直接上jq代码:

    $(":input","#myForm")
    .not(":button",":reset","hidden","submit")
    .val("")
    .removeAttr("checked")
    .removeAttr("selected");

    另外需要备注的是:

    一、$(":input");//选择的是所有元素,包括input,textarea,select,button

    HTML代码:

    <form>
        <input type="button" value="Input Button"/>
        <input type="checkbox" />
     
        <input type="file" />
        <input type="hidden" />
        <input type="image" />
     
        <input type="password" />
        <input type="radio" />
        <input type="reset" />
     
        <input type="submit" />
        <input type="text" />
        <select><option>Option</option></select>
     
        <textarea></textarea>
        <button>Button</button>
     
    </form>

    JQ代码:

    $(":input")

    二、js清空表单数据的方式

    遍历页面的元素

    function ClearForm(id) {
        var objId = document.getElementById(id);
        if (objId == undefined) {
            return;
        }
        for (var i = 0; i < objId.elements.length; i++) {
            if (objId.elements[i].type == "text") {
                objId.elements[i].value = "";
            }
            else if (objId.elements[i].type == "password") {
                objId.elements[i].value = "";
            }
            else if (objId.elements[i].type == "radio") {
                objId.elements[i].checked = false;
            }
            else if (objId.elements[i].type == "checkbox") {
                objId.elements[i].checked = false;
            }
            else if (objId.elements[i].type == "select-one") {
                objId.elements[i].options[0].selected = true;
            }
            else if (objId.elements[i].type == "select-multiple") {
                for (var j = 0; j < objId.elements[i].options.length; j++) {
                    objId.elements[i].options[j].selected = false;
                }
            }
            else if (objId.elements[i].type == "textarea") {
                objId.elements[i].value = "";
            }
            //else if (objId.elements[i].type == "file") {
            // //objId.elements[i].select();
            // //document.selection.clear();
            // // for IE, Opera, Safari, Chrome
            // var file = objId.elements[i];
            // if (file.outerHTML) {
            // file.outerHTML = file.outerHTML;
            // } else {
            // file.value = ""; // FF(包括3.5)
            // }
            //}
        }
    }

    本人比较推荐第一种方式~

  • 相关阅读:
    mybatis源码(八) Mybatis中的#{} 和${} 占位符的区别
    mybatis源码(七)mybatis动态sql的解析过程下篇
    mybatis源码(六)mybatis动态sql的解析过程上篇
    JDBC的API介绍
    mybatis源码(五)mybatis日志实现
    jmeter: 报错锦集
    python3升级后pip提示TLS/SSL错误问题
    Pytest+Jenkins+Allure
    建议
    Android Studio Button事件的三种方式
  • 原文地址:https://www.cnblogs.com/circleone/p/7140453.html
Copyright © 2011-2022 走看看