简单jQuery警报窗口

我是jQuery的初学者，我想在不使用jQuery UI包的情况下构建一个简单的jQuery警报窗口，我在网上看到了一些插件，但我正在尝试从头开始构建它，我想要的是，当点击一个按钮时，它会出现一个警报窗口，其中包含ok和cancel按钮，单击“确定”后，转到另一个操作，如导航到链接并取消，只需关闭窗口即可。如果有人能给我看一个快速的代码示例，让我知道如何去做，那就太好了，谢谢你的帮助

因此，我假设html代码结构可能如下所示：

 <input type = "button" value="show alert">

<script>
 $("input").click(function(){
   )};
 </script>

$（“输入”）。单击（函数（）{
)};

您必须编写自己的CSS，但这里有一个示例

HTML:

最后是Javascript：

$(function() {
    $("#redirect").click(function(){
      $('#alertWindow').show();
      return false;
    });
    $('#btnCancel').click(function() {
        $('#alertWindow').hide();
    });
    $('#btnOk').click(function() {
        location.href = 'http://www.google.com';
        return false;
    });
});

是JSFIDLE上该代码的工作副本

让Jquery对话框试一试

$（“输入”）。单击（函数（）{
$（“#myDiv”）。对话框({
按钮：{
“OK”：函数（）{
window.location.href=//我的url
},
“取消”：函数（）{
此对话框（“关闭”）；
}
})
//将所有其他对话框选项放在此处
});
)};

#alertWindow {
  display: none;
  text-align: center;
  border: 1px solid #333;
  width: 200px;
  height: 80px;
  border-radius: 5px;
  padding: 10px;
}
#btnOk, #btnCancel { width: 70px; }

$(function() {
    $("#redirect").click(function(){
      $('#alertWindow').show();
      return false;
    });
    $('#btnCancel').click(function() {
        $('#alertWindow').hide();
    });
    $('#btnOk').click(function() {
        location.href = 'http://www.google.com';
        return false;
    });
});

<input type = "button" value="show alert">

<script>
 $("input").click(function(){
       $("#myDiv").dialog({
            buttons: {
                 "OK": function() {
                        window.location.href = //my url
                 },
                 "Cancel": function() {
                         this.dialog("close");
                 }
             })
             //put all your other dialog options here
        });
   )};
 </script>