onsubmit =“函数()“;不起作用

onsubmit="function()" is not working

本文关键字:不起作用 函数 onsubmit      更新时间:2023-09-26

我想在django中验证动态添加的表单字段(存在于templates/appname中)。我在javascript的帮助下添加这些字段(addInput.js -存储在脚本标签中作为源的地方),其中还具有删除这些字段以及验证这些字段值的逻辑。但是当我点击send_invite按钮时,它再次引导我到app/register,当我第一想要它应该去validateEmail()函数,如果一切都很好然后它应该重定向到app/register。

    var counter = 1;
    var limit = 5;
    function addInput(divName) {
      if (counter == limit) {
        alert("You have reached the limit of adding " + counter + " Email Addresses");
      } else {
        var newdiv = document.createElement('div');
        newdiv.innerHTML = "<p id = 'remove" + counter + "'>Email Address " + (counter + 1) + " : " + "<input type = 'text' name ='myInputs[]'></p>";
        document.getElementById(divName).appendChild(newdiv);
        counter++;
        alert(counter + "add");
      }
    }
    function removeInput(divName) {
      if (counter == 1) {
        alert("You have reached the limit of removing Email Addresses");
      } else {
        counter--;
        var olddiv = document.getElementById("remove" + counter);
        alert(counter + "remove");
        olddiv.parentNode.removeChild(olddiv);
      }
    }
    function validateEmail(divName) {
      var emailFilter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-]+.)+([a-zA-Z0-9]{2,4})+$/;
      console.log("cmn");
      alert("cmn");
      for (i = 0; i < counter; i++) {
        var email = $("#remove" + i).val();
        alert(email);
        //      return true;
      }
      return true;
    }
<div id="page-wrapper">
  <div class="row">
    <div class="col-lg-12">
      <br>
      <h1 class="page-header">
        Send Invites
        </h1>
      <form method="POST" onsubmit="return validateEmail('dynamicInput')" action="/app/register/">
        <div id="dynamicInput">
          <p id='remove0'>Email Address 1 :
            <input type="text" name="myInputs[]">
          </p>
        </div>
        <br>
        <br>
        <input type="button" value="Add another Email Address" onClick="addInput('dynamicInput');">
        <input type="button" value="Remove Email Address Field " onClick="removeInput('dynamicInput');">
        <br>
        <br>
        <input type="submit" value="Send Invites">
        <input type='hidden' name='csrfmiddlewaretoken' value='xyz' />
      </form>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->
  </div>
  <!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
</div>
<style>
  a.active {
    background-color: #eee;
  }
</style>

但是为什么这没有发生呢?另外两个javascript函数addInput和removeInput工作正常。只有validateEmail没有被调用,为此我甚至调用alert和console.log,但没有显示任何内容。请帮助。我是javascript的新手。

运行代码,单击按钮,您将在控制台中得到以下错误:

Uncaught SyntaxError:无效正则表达式:/^ ([a-zA-Z0-9 _.-])+@(([ a-zA-Z0-9 -] +) + ([a-zA-Z0-9]{2,4}) +/美元:无端接的组

看代码你有一个额外的(

)
/^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-]+.)+([a-zA-Z0-9]{2,4})+$/;
                    ^

所以你要么缺少一个闭合的)要么你有一个额外的(。我猜你在+之前漏了一个)。看看你在哪里找到了reg exp,看看它应该是什么。