jQuery对话框需要单击两次才能打开

Question

我有一个jQuery对话框，当我单击类.currentDay时需要打开，但这仅在第二次单击时有效。 我在想我要在第一次单击时初始化模态，然后在第二次打开它。

我尝试了不同的方法使其初始化并打开，但是我似乎无法使其正常工作。 希望这里有人可以帮我。 这是我目前拥有的JavaScript。

  $('.currentDay').click(function () { var id = event.target.id; var url = '/Home/CalenderPartial/' + id; var dialog = $('<div style="display:none"></div>').appendTo('body'); dialog.load(url, {}, function (responseText, textStatus, XMLHttpRequest) { dialog.dialog({ autoOpen: true, closeText: "", width: $(window).width() - 300, height: $(window).height() - 100, close: function (event, ui) { dialog.remove(); } }); }); return false; }); 

它还会引发错误：未捕获的TypeError：dialog.dialog不是函数，但是仍在工作。

Answer 1

您是否尝试防止默认锚定行为？

 $('.currentDay').click(function ( e ) {
        e.preventDefault();
        alert('test');
 }); 

全部归功于github上的早期文章： 来源

Answer 2

对我来说工作正常...请检查工作示例

 $('.currentDay').click(function () { var id = event.target.id; var url = '/Home/CalenderPartial/' + id; var dialog = $('<div style="display:none"></div>').appendTo('body'); dialog.load(url, {}, function (responseText, textStatus, XMLHttpRequest) { dialog.dialog({ autoOpen: true, closeText: "", width: $(window).width() - 300, height: $(window).height() - 100, close: function (event, ui) { dialog.remove(); } }); }); return false; }); 

 @import "//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"; @import "/resources/demos/style.css"; 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <button class="currentDay">BTN 1</button> <button class="currentDay">BTN 2</button> <button class="currentDay">BTN 3</button>