Question

所以我有一个计算机科学学院的工作，我必须做一个网站，其中一项标准是它需要一定数量的JavaScript。我的老师建议我在完成“与我们联系”表单后单击“提交”时创建一个确认弹出窗口。

问题是我对javascript一无所知，对HTML和CSS也一无所知。 “与我们联系”表单是从在线某个地方获取的，并进行了略微修改以适合我的网站的主题，而我在大学期间的伙伴为我提供了很多帮助，使我在调整内容方面大有帮助，因此，不用说我现在很困惑，我的任务是明天到期。

我试图在网上寻找简单的代码行。基本上，当有人单击我网站上已有的“提交”按钮时，我需要弹出确认窗口。它需要用Java编写。我还无法在线找到任何可以做到这一点的东西，他们要么在切换到另一个网页（即“ a”标签）时请求弹出确认，要么？对？它使用的是href =，我想在这里不能使用。

在此处与我们联系表格：

================================================ =======================

  <body>
    <header>
      <nav>
          <a href="./index.html">
            <img id="logo" src="./images/logo.jpg" href="./index.html"  title="Home">
          </a>

        <div id="navbuttons">
          <a class="navButton" href=./about.html>About</a>
          <a class="navButton" href=./services.html>Services</a>
          <a class="navButton" href=./products.html>Products</a>
        </div>
      </nav>
    </header>
    <div class="container">
  <form action="action_page.php">

    <label for="fname">First Name</label>
    <input type="text" id="fname" name="firstname" placeholder="Your name..">

    <label for="lname">Last Name</label>
    <input type="text" id="lname" name="lastname" placeholder="Your last name..">

    <label for="country">Country</label>
    <select id="country" name="country">
      <option value="UK">UK</option>
      <option value="China">China</option>
      <option value="Other">Other</option>
    </select>

    <label for="subject">Subject</label>
    <textarea id="subject" name="subject" placeholder="Write your message here..." style="height:200px"></textarea>

    <input type="submit" value="Submit">

  </form>
</div>
</body>

================================================ =======================

这是它随附的CSS：

================================================ =======================

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical
}


input[type=submit] {
  background-color: #BB1B25;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

如您所见，此处没有任何内容会导致出现确认窗口。因此，在这段庞大的文本墙之后，我要提出一个问题：有人点击“提交”后，我需要如何添加确认窗口？我需要使用javascript进行计数。另外，该表格并不意味着可以实际使用，因为它将永远不会被托管，所以请不要尝试自行修复表格，因为它足以让我获得通行证...只需要一个确认窗口;（

请。在此先感谢所有阅读此书的人。

Answer 1

<form action="action_page.php" onsubmit="return confirm('Are you sure?')">

form元素具有一个onsubmit事件，可以通过JavaScript附加该事件。

您可以通过多种方式来执行此操作，但是最简单的方法是将onsubmit属性添加到form元素中。

如果onsubmit事件返回false，则该表单将不会提交，因此您可以添加一个JavaScript确认对话框窗口并返回其结果，因为它将产生true或{{1} }基于用户操作的响应。

有人单击我的网站上的按钮后，如何用Javascript出现弹出式确认？

1 个答案: