1

我想个性化（设计css，按钮......）一个“确认”javascript对话框，但想保持它的持久性。该对话框在倒计时后显示，因此即使用户正在运行浏览器的另一个选项卡或运行另一个应用程序，它也很重要。

我在网络上找到了许多漂亮的解决方案，但它们都忽略了持久性的这一方面。

问候

4

2 回答 2

0

通过坚持，我不确定你的意思。如果您正在寻找一种解决方案，使对话框阻止用户甚至无法关闭选项卡，除非他们提供数据，那么这是不可能的。

不过，我最近开发了自己的对话框。非常容易使用 css 进行样式设置，请查看底部的演示以及网站http://dialogjs.com/

在实际发布您的网站之前，我必须要求您确保它运行顺利，因为它不是 100% 没有错误的。还要注意可能会有重大变化的空间，因为它只是一个测试版本。

现在对于确认对话框，您只需

new Dialog()
.confirm("Continue?", function(result){
    this.data.continue = result;
})
.confirm(function(){return "Are you sure you wish to "+ (this.data.continue ? "continue" : "cancel")}, function(result){
})

您也可以编写自己的对话框类型http://jsfiddle.net/q5zL7y6e/1/

于 2015-02-26T19:48:54.140 回答
0

//HTML代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
  </head>
  <body>
    <dialog id="dialog">
      <h4 id="dialog_header">Datenschutzhinweis</h4>
      <p id="dialog_text">
        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
        eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
      </p>
      <label
        ><input
          type="checkbox"
          id="dialog_checkbox"
          value="checked"
        />Einverstanden</label
      >
      <button onclick="Dialog_close()">Dialog schließen</button>
    </dialog>

    <script src="dialogJS.js"></script>
  </body>
</html>

//JS代码

function Dialog_close() {
  var dialog_checkbox = document.getElementById("dialog_checkbox");
  var dialog = document.getElementById("dialog");
  var dialog_text = document.getElementById("dialog_text");
  if (dialog_checkbox.checked) {
    dialog.close();
  } else {
    dialog_text.style.color = "red";
  }
}

document.getElementById("dialog").showModal();
于 2020-11-26T15:07:32.073 回答