猿问

js文件中有多个添加事件接收器,只有一个工作

所以我正在玩HTML和JS,我有两个网页,每个网页都有自己的addEventListener,当用户从这些页面提交表单时,我需要工作。但是,只有“登录”页面的事件警报器正常工作 - “重置密码”页面的事件警报器不起作用。我尝试在JS文件中交换他们的订单,然后我的重置密码一个工作,而我的登录没有。是否有可能在一个JS文件中有多个addEventReleners,在需要时都能正常工作?


代码如下:


登录页面:


<!DOCTYPE HTML>

<html>

<head>

<meta charset="UTF-8">

<title>Log In</title>

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="style.css">

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.7/css/all.css">

</head>

<body id="formBodyBG">

<header>    

    <div>

        <div id="navMenu">

          <ul>

            <li class="logo">

                <a href="index.html" class="navLink home">Home</a>

            </li>

            <li class="createAccount">

              <a href="createAccount.html" class="navLink createAccountButton">Create Account</a>

            </li>

          </ul>

        </div>

      </div>

</header>

<section class="mainBody">

    <div class="leftSide"></div>

    <div class="mainForm">

            <h1 style="text-align:center; margin-bottom:12px; font-size:32px">Welcome Back!</h1>

            <h5 style="text-align:center; margin-bottom:25px">Log in to review, analyze past trends, or import new data.</h5>

            <form class="form" id="loginForm" action="dashboard.html" method="GET">

                <div class="mainFormDesign">

                    <label>Username</label>

                    <input type="text" id="username" name="username" class="input"><br>

                    <i class="fa fa-check-circle"></i>

                    <i class="fa fa-exclamation-circle"></i>

                    <small>Error message</small><br><br>

                </div>

            </form>

    </div>

    <div class="rightSide"></div>

</section>

<script type="text/javascript" src="/pages/code.js"></script>


慕丝7291255
浏览 74回答 1
1回答

ibeautiful

由于登录表单不存在,因此重置表单页面上将出现错误,这会阻止javascript完成,反之亦然,它可能会引发错误,但适用于登录部分。确实检查了控制台。在浏览器中打开 html,然后按 F12解决方案:只添加事件侦听器是元素 !== nullif&nbsp;((typeof&nbsp;loginForm&nbsp;===&nbsp;'undefined')&nbsp;||&nbsp;(loginForm&nbsp;!==&nbsp;null)){ &nbsp;&nbsp;&nbsp;loginForm.addEventListener...... }
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答