Question

控制台日志一直说明没有在点击此按钮时定义该功能。我真的找不到原因。我有另外两个使用相同格式的弹出窗口，当我按下每个弹出窗口的每个按钮时，所有这些弹出窗口都表示函数未定义。该页面没有说明有任何明显的javascript语法错误。

感谢您的帮助

HTML

<div class="popup" id="popup-subscribe">
   <div id="close-subscribe" class="close-button"> </div>
   <div class="popup-title">Subscribe</div>
   <form method="post" name="subscribe" action="">
      <span class="label" style="margin-right: 5px">Name: </span><input type="text" placeholder="Name" name="name" /><br>
      <span class="label" style="margin-right: 5px">Email: </span><input type="text" placeholder="Email" name="email_subscribe" /><br>
      <div class="errors" id="subscribe-errors"></div>
      <div onclick="validateSubscribeForm()" class="button-medium">Sign me up!</div>
   </form>
</div>

的Javascript

function validateSubscribeForm() {
var emailSubscribe =document.forms["subscribe"]["email_subscribe"].value;
var atpos=emailSubscribe.indexOf("@");
var dotpos=emailSubscribe.lastIndexOf(".");
var name = document.forms["subscribe"]["name"].value;
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=emailSubscribe.length)
  {
  $("#subscribe-errors").html("The email you entered is not valid");
  return false;
  } 
  else if (name == null || name == "") 
  {
  $("#subscribe-errors").html("Please enter a name");
  }else {
  document.subscribe.submit();
  }
}

具体来说，控制台日志错误说明：Uncaught ReferenceError：validateSubscribeForm未定义

Answer 1

您需要将JavaScript函数定义放在HTML的head标记中：

<head>
    <!-- INCLUDE jQuery library first -->
    <script type="text/javascript">
        function validateSubscribeForm() {
            var emailSubscribe = document.forms["subscribe"]["email_subscribe"].value;
            var atpos = emailSubscribe.indexOf("@");
            var dotpos = emailSubscribe.lastIndexOf(".");
            var name = document.forms["subscribe"]["name"].value;
            if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailSubscribe.length) {
                $("#subscribe-errors").html("The email you entered is not valid");
                return false;
            } else if (name == null || name == "") {
                $("#subscribe-errors").html("Please enter a name");
            } else {
                document.subscribe.submit();
            }
        }
    </script>
</head>

<body>
    <div class="popup" id="popup-subscribe">
        <div id="close-subscribe" class="close-button"></div>
        <div class="popup-title">Subscribe</div>
        <form method="post" name="subscribe" action=""> <span class="label" style="margin-right: 5px">Name: </span>

            <input type="text" placeholder="Name" name="name" />
            <br /> <span class="label" style="margin-right: 5px">Email: </span>

            <input type="text" placeholder="Email" name="email_subscribe" />
            <br />
            <div class="errors" id="subscribe-errors"></div>
            <div onclick="validateSubscribeForm()" class="button-medium">Sign me up!</div>
        </form>
    </div>
</body>

Answer 2

你错过了Jquery在这里。包括Jquery库。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

错误地说没有定义函数

2 个答案: