Javascript jQuery 对话框按钮如何设置点击事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6955694/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery dialog button how to set the click event?
提问by The Demz
Ok i got this code:
好的，我得到了这个代码：
$(document).ready(
function() {
$(".dialogDiv").dialog({
autoOpen: false,
modal: true,
position: [50, 50],
buttons: {
"Print page": function() {
alert("Print");
},
"Cancel": function() {
$(this).dialog("close");
}
}
}
);
$('.ui-dialog-buttonpane button:contains("Print page")').attr("id", "dialog_print-button");
$(".dialogDiv").parent().appendTo($('form'));
}
How do I assign or set a new function to the click event?
如何为点击事件分配或设置新功能？
$("#dialog_print-button"). ???
$("#dialog_print-button")。？？？
Edit, This works:
编辑，这有效：
$("#dialog_print-button").unbind("click").click(
function () {
alert("new function that overide the old ones")
}
)
Tried to find how to do in the jQuery documentation but I think it's hard to find around in the documentation. Especially when new to javaScript and the jQuery libary.
试图在 jQuery 文档中找到如何做，但我认为在文档中很难找到。尤其是对 javaScript 和 jQuery 库不熟悉时。
Edit, A fast way to get help is to go to jQuery irc channel :D
编辑，获得帮助的快速方法是转到 jQuery irc 频道 :D
采纳答案by Mati
$("#Print page").click(function () {
...
});
Or maybe it should be
或者它应该是
$("#dialog_print-button").click(function () {
...
});
回答by Igor Dymov
I think this would help:
我认为这会有所帮助：
$(".dialogDiv").dialog("option", "buttons", {
"Print page": function() { /* new action */ },
"Cancel": function() { $(this).dialog("close"); }
});
Because buttonsproperty sets all the buttons, you have to include cancelbutton handler.
因为buttons属性设置了所有按钮，所以您必须包含cancel按钮处理程序。
回答by Jacob Stamm
jQuery UI dialog buttons now supports the "id" attribute natively.
jQuery UI 对话框按钮现在原生支持“id”属性。
$("#dialog-form").dialog({
autoOpen: false,
height: "auto",
width: 300,
buttons:
[
{
text: "Create Revision",
id: "btnCreateRev",
click: function () {
//code for creating a revision
}
},
{
text: "Cancel",
id: "btnCancel",
click: function () { $(this).dialog("close"); },
}
]
});
回答by Francesco
You put the code within the button section:
您将代码放在按钮部分：
...
buttons: {
"Print page": function() {
//here you execute the code or call external functions as needed
}
Once you click the button on the Dialog, that code is automatically invoked. Therefore you insert there directly the code that implements your logic.
单击对话框上的按钮后，将自动调用该代码。因此，您可以直接在那里插入实现您的逻辑的代码。
