[英]Adding Jquery UI Dialog to a button
I have wrote a simple code testing Jqyery UI dialog like this: 我编写了一个简单的代码测试Jqyery UI对话框,如下所示:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="topo.css">
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/smoothness/jquery-ui.css"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script>
plugin = {
mainPageRenderer: function () {
var plugin = this;
var addButton = $('<input id="addButton" class="addButton" type="submit" value="+">');
addButton.click(plugin.addFU);
plugin.html = $('<div class="main-page"></div>');
plugin.html.append(addButton);
},
addFU:function(){
$(this).dialog({
buttons: [
{
text: "OK",
click: function() {
$( this ).dialog( "close" );
}
}
]
});
},
refresh: function() {
var plugin = this;
plugin.mainPageRenderer();
$("body").append(plugin.html);
}
};
$(document).ready(function() {
plugin.refresh();
});
</script>
</head>
<body>
The problem is while clicking on OK button in JQUERY UI dialog my "+"-button in origin page disappears. 问题是在JQUERY UI对话框中单击“确定”按钮时,原始页面中的“ +”按钮消失了。 Ho I can prevent it? 我可以预防吗?
You need to try using 您需要尝试使用
Javascript Java脚本
<script type="text/javascript">
$(function(){
var execute = function() {
alert('This is Ok button');
}
var cancel = function() {
alert('This is Cancel button');
}
var dialogOpts = {
buttons: {
"Ok": execute,
"Cancel": cancel
}
};
$("#myDialog").dialog(dialogOpts);
});
</script>
HTML 的HTML
<input id="myDialog" class="addButton" type="submit" value="+">
OR 要么
Javascript Java脚本
$('#myDialog').dialog({
// properties ...
buttons: [{
id:"btn-accept",
text: "Accept",
click: function() {
$(this).dialog("close");
}
},{
id:"btn-cancel",
text: "Cancel",
click: function() {
$(this).dialog("close");
}
}]
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.