用于HTML中弹出消息的函数

Function for pop up message in HTML

本文关键字：消息 函数 HTML 用于      更新时间：2023-09-26

我有HTML文件。用户在提交之前输入了哪些详细信息我希望用户收到一条弹出消息，用户可以在其中查看他/她在表单中输入的所有详细信息。我想知道要使用什么功能，以便在提交表单之前收到一条确认的弹出消息。

如果您不太关心这个弹出窗口的布局，只需使用window.confirm()

您可以将其构建到HTML表单中，如下所示：

<html>
  <script>
    function checkForm() {
      var message = "You entered following data:'n" + 
        "Car name: " + document.getElementById('cn').value + "'n" +
        "Car color: " + document.getElementById('cc').value + "'n" + 
        "Is this correct?";
      if (window.confirm(message))
        document.getElementById("carform").submit();
    }
  </script>

  <form id="carform" target="...">
    Car name: <input type="text" name="carname" id="cn"/><br/>
    Car color: <input type="text" name="carcolor" id="cc"/><br/>
    <input type="button" value="submit" onclick="checkForm()"/>
  </form>
</html>

编辑要将输入的值与存储在SQL数据库中的值进行比较，必须使用PHP。例如，你可以这样实现：

<html>
  <script>
    function checkForm() {
      <?php
        //Query the current databse values and store them for example in $carcolor $carname
        echo 'var currentCarName = "' . $carname . '"';
        echo 'var currentCarColor = "' . $carcolor . '"';
      ?>
      var message = "You entered following data:'n" + 
        "Car name: "    + document.getElementById('cn').value + "'n" +
        "  Old name: "  + currentCarName + "'n" +
        "Car color: "   + document.getElementById('cc').value + "'n" + 
        "  Old color: " + currentCarColor + "'n" +
        "Is this correct?";
      if (window.confirm(message))
        document.getElementById("carform").submit();
    }
  </script>

  <form id="carform" target="...">
    Car name: <input type="text" name="carname" id="cn"/><br/>
    Car color: <input type="text" name="carcolor" id="cc"/><br/>
    <input type="button" value="submit" onclick="checkForm()"/>
  </form>
</html>

没有本地函数可以在加载HTML时显示弹出消息。然而，FancyBox正是这样做的。

http://fancybox.net/

查看这个问题和这个博客，了解有关如何进行的更多信息

相关文章：