jQueryUI對話框替換確認？

我試圖重寫與jQueryUI的對話框中的默認確認框，這裏是我的嘗試：jQueryUI對話框替換確認？

window.confirm = function (message_confirm) { 
     $(document.createElement('div')) 
      .attr({ title: 'Please confirm', 'class': 'confirm', 'id': 'dialogconfirm' }) 
      .html(message_confirm) 
      .dialog({ 
       buttons: { YES: function() { return true; }, NO: function() { $(this).dialog('close'); } }, 
       close: function() { $(this).remove(); }, 
       draggable: true, 
       modal: true, 
       resizable: false, 
       width: 'auto', 
       hide: { effect: "fade", duration: 300 }, 

      }); 

    };

這工作，因爲一旦這個腳本的運行，調用定期confirm顯示jQueryUI的對話框，但是，YES選擇不起作用。我有一個像下面這樣的ajax調用：

if (confirm("Are you sure you want to delete this user?")) 
{ 
     alert("test"); 
    //ajax call 
} 
return false;

而測試警報沒有出現。對話的NO選項沒問題。我怎樣才能讓YES工作？

謝謝。

來源

2016-08-02 ITWorker

任何錯誤？嘗試與console.log而不是警報？ console.log是否在「YES：」函數中工作（用return true替換）？ – ggzone

@ggzone沒有錯誤。用'console.log（「對話框被點擊」）代替'return true'，並且當我點擊是時它在控制檯上正確顯示。 console.log代替警報也沒有出現（與原始警報測試相同的行爲）。 – ITWorker

好吧，你想要一個回調函數。已經有一個很好的答案如何做到這一點 – ggzone

因爲對話框是異步的，你可以使用一個延遲的方法：

window.confirm = function (message_confirm) { 
 
    var defer = $.Deferred(); 
 
    $('<div/>', {title: 'Please confirm', 'class': 'confirm', 'id': 'dialogconfirm', text: message_confirm}) 
 
    .dialog({ 
 
    buttons: { 
 
     YES: function() { 
 
     defer.resolve("yes"); 
 
     $(this).attr('yesno', true); 
 
     $(this).dialog('close'); 
 
     }, NO: function() { 
 
     defer.resolve("no"); 
 
     $(this).attr('yesno', false); 
 
     $(this).dialog('close'); 
 
     } 
 
    }, 
 
    close: function() { 
 
     if ($(this).attr('yesno') === undefined) { 
 
      defer.resolve("no"); 
 
     } 
 
     $(this).remove(); 
 
    }, 
 
    draggable: true, 
 
    modal: true, 
 
    resizable: false, 
 
    width: 'auto', 
 
    hide: {effect: "fade", duration: 300} 
 
    }); 
 
    return defer.promise(); 
 
}; 
 

 
$(function() { 
 
    confirm("Are you sure you want to delete this user?").then(function(yesno) { 
 
    console.log(yesno); 
 
    }); 
 
});

<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

來源

2016-08-02 14:33:11 gaetanoM

執行操作後，此工作並關閉對話框。我在檢查'yesno'後執行了這個操作。非常感謝。 – ITWorker

@ITWorker代碼片段更新：我添加了$（this）.attr（'yesno'，true）;或者錯誤，我會在測試之前關閉對話框。這樣，如果您在任何情況下都使用ESC或X關閉對話框，則會執行解析延遲操作，然後執行該部分。 – gaetanoM

完美的謝謝。 – ITWorker

你可以回調參數添加到功能

window.confirm = function (message_confirm, ok_callback)

火它是

buttons: { YES: function() { ok_callback(); }}

，後來再這樣下去

confirm("message", function(){ 
    alert('smth'); 
});

來源

2016-08-02 14:23:44

這工作，但對話框仍然留在那裏後，我點擊是和行動執行。謝謝您的幫助。 – ITWorker

嘗試類似下面。它爲我工作。

<script> 
    $(function() { 
    $("#dialog-confirm").dialog({ 
     resizable: false, 
     height: "auto", 
     width: 400, 
     modal: true, 
     buttons: { 
     "Delete user": function() { 
      alert("test"); 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div id="dialog-confirm" title="Please confirm"> 
    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>Are you sure you want to delete this user?</p> 
</div>

來源

2016-08-02 14:31:05 spm

我沒有嘗試過，但感謝回覆。我試圖讓它可以在整個應用程序中被替換，並且這將允許我使用不同的行爲來進行是的，而不是每次都在對話框中定義它。 – ITWorker

jQueryUI對話框替換確認？

回答

相關問題