Question

if (confirm('ARE YOU SURE?')) {console.log('sure');}
else {console.log('not sure');}

我想要带有我自己的确认框和我自己的功能的功能

<div class='mdialog' id='mdialog'>
<div id='dgcancel' onclick="???">CANCEL</div>
<div id='dgok' onclick="???">OK</div>
<div id='dgquestion'>//here is the question</div>
</div>

if (conf('ARE YOU SURE?')) {console.log('sure');}
else {console.log('not sure');}

function conf(){
// ???
}

有人可以帮我完成这个任务吗？

Answer 1

您拥有html的框架。

代替???放置一些可替换的东西，例如{{cancelCallback}}，{{okCallback}}，{{question}}。

然后，创建一个可以实例化的Dialog类。这是一个不错的起点：What techniques can be used to define a class in JavaScript, and what are their trade-offs?

该类应将3件事（不一定按此顺序）作为参数：

单击取消时将调用的函数
单击确定时会调用的函数
实际问题

此类实例化后，应显示或注入DOM中的HTML框架，同时用实际的函数/字符串替换{{}}变量。

您应该可以对此类使用“处置”方法。

为未来做准备：也许您添加更多按钮-使它可扩展。等等

玩得开心！

_{我希望您不期望为此提供代码，因为那不是
StackOverflow的目的：）}

Answer 2

您要指出的问题尚不清楚。使用confirm功能将带您进入一个确认对话框，回答ok和cancel。

另一个人正在使用div标签来确认ok和cancel。您可以将其更改为button。

我对您的代码进行了一些更改，并创建了一个pen您可以访问并尝试使用它。

function myFunction(x) {
  if (x == "ok") {
    var conf = confirm("Are you sure You want to delete this item");

    if (conf == true) { //this block means the user clicked the "OK" in the confirmation dialog box.
      //Some statement here
      //example alert statement
      alert("Item has been successfully deleted!");
    }
  }
  if (x == "cancel") {
    var cancel = confirm("Are you sure you want to cancel");
    
    if (cancel == true) {
      alert("Item deletion has been cancelled");
    }
  }
}

<div class='mdialog' id='mdialog'>
  <div id='dgquestion'>
    <h1>Do you want to Delete this item?</h1>
  </div>
    <button onclick="myFunction('ok')">OK</button>
    <button onclick="myFunction('cancel')">CANCEL</button>
</div>

javascript：使用我自己的确认框和功能确认功能

2 个答案: