Question

我有HTML文件。用户在提交之前输入的详细信息我希望用户获得弹出消息，用户将能够查看他/她在表单中输入的所有详细信息。我想知道要使用什么功能，以便在提交表单之前有一个弹出消息来确认。

Answer 1

如果您不太关心此弹出式窗口的布局，请使用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>

Answer 2

没有本地功能可以让弹出消息显示加载HTML。然而，FancyBox就是这样做的。

http://fancybox.net/

请查看this question和this blog，了解有关如何执行此操作的更多信息

HTML中弹出消息的功能

2 个答案: