我怎样才能使它以 JQuery 的 un 形式工作 resetAll

Question

我想在单击时激活 link resetAll（以清除表单字段中的所有 6 个输入）。喜欢这个代码 https://jsfiddle.net/fm1y5c8v/3/:

ACC.multiLogin = {
     _autoload: [
        "resetAllFields",

     ],

 resetAllFields: function() {
    $(".resetFieldJs").on("click", function(){
            $("#multilogin-search input").each(function(){
                var input = $(this);
                input.val("");

                });
            });
    },
    }

感谢您的帮助

Answer 1

您可以尝试使用 Vanilla JS 进行更改：

resetAllFields: function() {
    $(".resetFieldJs").on("click", function(){
            document.getElementById("multiLogin-search").reset();
            });
    },
    }

没有 jQuery 的更简单的方法是为 a 标签提供一个 onclick 方法和一个 JS 函数，如下所示：

<a onclick='myFunc();' class="resetFieldJs" >resetAll<spring:theme code="multilogin.search.link.emptyfields"/></a>

JS:

function myFunc(){
    document.getElementById("multiLogin-search").reset();
}

Answer 2

jQuery 本身没有 reset() 方法，但本机 JavaScript 有。所以我们可以做的是使用以下选项之一将 jQuery 元素转换为 JavaScript 对象。

$("#multiLogin-search")[0].reset();
OR
$("#multiLogin-search").get(0).reset();

$(".resetFieldJs").on("click", function(){
  $("#multiLogin-search")[0].reset();
  //$("#multiLogin-search").get(0).reset();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form id="multiLogin-search" class="d-none">
  <div class="column">
    <div class="text-input-wrap">
      <p> Customer number <p>
      <p> <input class="text-input" type="text" name="customerCode"  > <p>
    </div>
    <div class="text-input-wrap">
      <p> Country <p>
      <p> <input class="text-input" type="text" name="country"  > <p>
    </div>
    <div class="text-input-wrap">
      <p> Postal Code <p>
      <p> <input class="text-input" type="text" name="postalCode"  > <p>
    </div>
   </div>
    <div class="column">
        <div class="text-input-wrap">
            <p> Customer Name <p>
<p> <input class="text-input" type="text" name="customerName" > <p>
        </div>
        <div class="text-input-wrap">
            <p> City <p>
<p> <input class="text-input" type="text" name="city" > <p>
        </div>
        <div class="text-input-wrap">
            <p> Address <p>
<p> <input class="text-input" type="text" name="address"><p>
        </div>
    </div>

  <div class="emptyFieldsLink" >
    <a class="resetFieldJs" >ResetAll<spring:theme code="multilogin.search.link.emptyfields"/></a>
   </div>
</form>

我怎样才能使它以 JQuery 的 un 形式工作 resetAll

how can i make it work resetAll in un form with JQuery

html

javascript

css

jquery

hybris