Onclick按钮显示弹出框,带有Yes / No选项。 jQuery的/ HTML

时间:2017-09-02 08:10:35

标签: javascript jquery html

我点击了一个按钮id="contact-submit"我的脚本运行后发送消息给slack。

我想要的是在用户点击按钮后我想要一个弹出框来显示询问你确定吗?是/否

Yes = Sends the message as it does now
No = Closes the popup with no action

任何人帮助我,我已经尝试了几个小时!

HTML

<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Log</button>

脚本

   $(document).ready(function(){
        $('#contact-submit').on('click',function(e){
            e.preventDefault();
            var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxx'
            var text = 'Some Text Here'
            $.ajax({
                data: 'payload=' + JSON.stringify({
                    "text": text
                }),
                dataType: 'json',
                processData: false,
                type: 'POST',
                url: url
            });
        });
    });

1 个答案:

答案 0 :(得分:2)

您可以使用默认的confirm javascript弹出窗口,如下所示:

if(!confirm("Are you sure?")) 
   return false;

见下面的演示:

$(document).ready(function() {
  $('#contact-submit').on('click', function(e) {
    e.preventDefault();
    if(!confirm("Are you sure?")) 
       return false;
    var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxx'
    var text = 'Some Text Here'
    $.ajax({
      data: 'payload=' + JSON.stringify({
        "text": text
      }),
      dataType: 'json',
      processData: false,
      type: 'POST',
      url: url
    });
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Log</button>