如何打开一个确认对话窗口通过点击一个botton

我一直在阅读一些文章和JQuery UI的文档，以创建一个按钮点击后，用JQuery UI的对话框窗口，但直到现在我不知道不清楚这是如何工作的，因为我试了一下我的情况，并没有运行。这就是我所拥有的，可以有人这样善良，并解释我做错了什么？如何打开一个确认对话窗口通过点击一个botton

<button type='button' id='btn_reset'style='display:block;'>Reset</button> 

<div id="warnungdialog" title="Warnung" style="display:none;"> 
     <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"> 
     </span>Was wird passiert?</p> 
</div>

这是我在Jquery的侧

$(btn_reset).on('click', function() { 

    $("#warnungdialog").dialog({ 
     autoOpen: false, 
     modal: true, 
     width: 350, 
     height: 'auto', 
     buttons: { 
      Weiter: function() { 
       $(this).dialog("close"); 
      }, 
      Abbrechen: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $(btn_reset).button(); 
    $(btn_reset).click(function() { 
     $('#warnungdialog').dialog('open'); 
    }); 

});

来源

2015-11-02 zgrizzly_7

在控制台中的任何错误？ –

试试这个：

$(function() { 
     $("#warnungdialog").dialog({ 
      autoOpen: false, 
      modal: true, 
      width: 350, 
      height: 'auto', 
      buttons: { 
       Weiter: function() { 
        $(this).dialog("close"); 
       }, 
       Abbrechen: function() { 
        $(this).dialog("close"); 
       } 
      } 
     }); 
     $('#btn_reset').button(); 
     $('#btn_reset').click(function() { 
     $('#warnungdialog').dialog('open'); 
     }); 
});

这里是一个工作fiddle。

来源

2015-11-02 10:36:41 deepakb

点击按钮没有反应，看起来像可解 –

检查小提琴！它的工作完美... – deepakb

更新[小提琴]（https://jsfiddle.net/deepakb/0rypnw0j/3/）根据您提供的HTML！ – deepakb

我认为您的代码不工作，因为，当你点击按钮关闭对话框声明只是做。对话声明必须在点击事件之前完成。这样

$(document).ready(function(){ 
// here dialog declaration 
$("#warnungdialog").dialog({ 
    autoOpen: false, 
    modal: true, 
    width: 350, 
    height: 'auto', 
    buttons: { 
     Weiter: function() { 
      $(this).dialog("close"); 
     }, 
     Abbrechen: function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

//here click event on button 
    $("#btn_reset").bind("click",function(){ 
    $('#warnungdialog').dialog('open'); 
}); 
});

来源

2015-11-02 10:34:22

嗨Fender！是的，我当然在文档的.ready函数里面调用了这个函数。但我不明白为什么不工作。 –

我认为你必须把对话声明放在“$（btn_reset）.on（'click'，function（）{}））” –

尝试：

$(btn_reset).button(); 
$(btn_reset).on('click', function() { 

    $("#warnungdialog").dialog({ 
     autoOpen: false, 
     modal: true, 
     width: 350, 
     height: 'auto', 
     buttons: { 
      Weiter: function() { 
       $(this).dialog("close"); 
      }, 
      Abbrechen: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

     $('#warnungdialog').dialog('open'); 

});

的jsfiddle：http://jsfiddle.net/qj6h7w2L/

来源

2015-11-02 11:03:34 madalinivascu

如何打开一个确认对话窗口通过点击一个botton

回答

相关问题