如何讓按鈕在jQuery確認對話框上執行操作？

我有一個jQuery的對話框，當您在圖像對話框中打開點擊，如果你想刪除你必須確認。 Yes或No.如何讓按鈕在jQuery確認對話框上執行操作？

我這樣做有三個文件：

主要index.php文件：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Aircrafts</title> 
    <link rel="stylesheet" type="text/css" href="../../../lib/css/style.css"> 
    <link rel="stylesheet" href="../../../lib/css/flick/jquery.ui.all.css"> 
    <script src="../../../lib/js/jquery.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.button.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.core.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.widget.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.mouse.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.button.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.draggable.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.position.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.resizable.js"></script> 
    <script src="../../../lib/js/ui/jquery.ui.dialog.js"></script> 


<script> 
$(function() { 
    $("#loadingdialog").dialog({ 
     autoOpen: false, 
     width: 300, 
     height: 65 
    }); 

    $("#loadingdialog").dialog('widget').find(".ui-dialog-titlebar").hide(); 
    $("#loadingdialog").dialog('widget').find(".ui-resizable-se").hide(); 


    $("#confirmdialog").dialog({ 
     autoOpen: false 
    }); 

    $("#confirmdialog").dialog('widget').find(".ui-resizable-se").hide(); 


}); 

    if (window.XMLHttpRequest) 
      { 
      ajax=new XMLHttpRequest(); 
      } 
     else 
      { 
      ajax=new ActiveXObject("Microsoft.XMLHTTP"); 
      } 

    function confirmdelete(str){ 

    var loading = $("#loadingdialog").dialog('open'); 
    var confirm = $("#confirmdialog"); 
     confirm.load("./confirm_dialog.php?icao="+str, function(){ 
     loading.dialog('close'); 
     confirm.dialog('open'); 
     $('#yes').blur(); 
     }); 
    } 

    function remove(str){ 

    var loading = $("#loadingdialog").dialog('open'); 
     confirm.load("./delete_aircarft.php?icao="+str, function(){ 
     refreshTable(function(){loading.dialog('close');}); 
     refreshTable(function(){$('#result').fadeIn(); document.getElementById('result').innerHTML=ajax.responseText;}); 
     setTimeout(function() { $('#result').fadeOut() }, 5000); 

     }); 
    } 

    function close(){ 

    $("#confirmdialog").dialog('close'); 

    } 
</script> 
</head> 
<body> 

<div id="result"></div></br> 

<div id="loadingdialog"><center><p><img src="../../../lib/images/loading.gif"></center></p></div> 

<div id="confirmdialog"></div> 

<img src="../../../lib/images/cross.png" onclick="confirmdelete('B737')"> 

</body> 
</html>

的confirm_dialog.php：

<script> 
    $("#yes") 
     .button() 
     .click(function(event) { 
    }); 

    $("#no") 
     .button() 
     .click(function(event) { 
    }); 
</script> 

<h2><font face="century Gothic">Are you sure?</font><h2><hr size="1"> 

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp 
<tr><td><input id="yes" type="submit" value="Yes" onclick="remove('<?php echo $_GET["icao"]; ?>')"></td>&nbsp&nbsp&nbsp<td><input id="no" type="submit" value="No" onclick="close()"/></td></tr>

而且delete_aircraft.php （目前，此文件只顯示獲得，在未來I'm要爲刪除做準備國際民航組織的，但它不是一個問題）：

<?php echo $_GET["icao"]; ?>

問題是對話框打開時，您可以單擊是或否，但如果您單擊是或否有isn't任何行動。

來源

2013-01-18 user1972864

把行動統一到您添加'＃yes'空點擊處理程序和'＃no' – bfavaretto

好，但它isn't的問題！ – user1972864

@ user1972864問題在於沒有任何反應。你還沒有實現任何東西。所以這是正常的行爲。 – Tchoupi

爲什麼不使用Dialog的內置按鈕？

$("#confirmdialog").dialog({ 
    autoOpen: false, 
    buttons: { 
    "Yes": function() { 
     // YOUR ACTION HERE // 
     $(this).dialog("close"); 
    }, 
    "No": function() { 
     $(this).dialog("close"); 
    } 
    } 
});

編輯：更新remove函數加載使用按鈕和所需的變量對話框：無需加載外部PHP文件。另外，在創建對話框時設置動畫 - 不需要所有這些額外的處理程序。

$("#confirmdialog").dialog({ 
    autoOpen: false, 
    show: "fade", // Fade In 
    hide: "fade" // Fade Out 
}); 


function remove(str){ 

    // Set the button action. str is available here 
    $("#confirmdialog").dialog("option", "buttons", { 
    "Yes": function() { 
     // YOUR ACTION HERE // 
     // str has the value of your "icao" variable 
     $(this).dialog("close"); 
    }, 
    "No": function() { 
     $(this).dialog("close"); 
    } 
    }); 

    // Open the dialog 
    $("#confirmdialog").dialog("open"); 
}

來源

2013-01-18 19:41:21

因爲我需要用ICBA發送按鈕。最終文件中的國際民航組織在PHP中！ – user1972864

好的，我明白了。在這種情況下，移動你的'''那應該工作。 –

以爲它看起來像你的價值，當你打開對話框 - 所以你不應該需要把它傳遞給PHP在所有（見'str'）：'confirm.load（」 ./ delete_aircarft.php國際民航組織=？「+ str' –

那是因爲你還沒有把任何東西有..

$("#yes") 
     .button() 
     .click(function(event) { 
    // do something 
    }); 

$("#no") 
     .button() 
     .click(function(event) { 
    // do something 
    });

來源

2013-01-18 19:37:48 SeanWM

好吧，我把這個功能放在這裏，但不工作！ – user1972864

不完全是問題。當然，沒有做任何事情。但是，它也是在DOM構建之前腳本正在執行，並且節點可能沒有綁定事件。 –

我認爲這個問題可能是當處理程序被創建時，Yes和No按鈕不存在。該腳本應移至HTML下方，或將'defer'添加到'

11. 如何在Jquery UI對話框中實現「確認」對話框？

12. 針對jQuery的按鈕點擊確認對話框

13. 非刪除操作確認對話框，在軌道上

14. 如何讓css類在JQuery中的確定按鈕的對話框？

15. 如何在ASP.NET中使用JQuery對話框作爲確認對話框？

16. 攔截刪除按鈕按下 - 在確認取消不執行任何操作

17. JQuery確認對話框

18. jquery ui對話框確認

19. JQuery的確認對話框

20. jQuery UI對話框確認

21. jquery確認對話框無所作爲

22. 如何在JQuery UI確認對話框中更改按鈕大小？

23. 如何更改按鈕標籤在jQuery UI的確認對話框

24. Jquery UI對話框按鈕確認打開URL

25. 使用JQuery確認對話框單選按鈕

26. ASP.NET按鈕中的jQuery確認對話框OnClientClick

27. ASP.Net圖像按鈕使用jQuery UI對話框刪除確認

28. 執行Django Admin操作之前的確認按鈕？

29. 如何讓jQuery UI對話框看起來像默認的JavaScript確認框？

30. 如何將確認對話框添加到Wordpress發佈按鈕？

如何讓按鈕在jQuery確認對話框上執行操作？

回答

相關問題