我怎样才能让它在 JQuery 中以 un 形式工作 resetAll

问题描述

我想在单击时激活链接 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("");

                });
            });
    },}

感谢您的帮助

解决方法

您可以尝试使用 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();
}

,

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>