摘要:JQuery UI,建立Dialog + Menu
<button id="opener" target='target'>Open APPXID Dialog</button><div id="dialog" ></div></span>
$("#dialog" ).ready(function() {
var dialog = $( "#dialog" );
var opener = $( "#opener" );
var menu = $('<div>');
var target = opener.attr('target');
opener.text('Get APP XID');
var size = 2;
var text_array = new Array(size);
text_array[0] = 'menu1';
text_array[1] = 'menu2';
text_array[2] = 'menu3';
var val_array = new Array(size);
val_array[0] = 'val1';
val_array[1] = 'val2';
val_array[2] = 'val3';
for (var i = 0; i < text_array.length; i++)
{
var div = $('<div>');
var link = $('<a>');
var text = text_array[i];
link.css('width','270px').css('display','block').css("font-size","15px").css("text-decoration","none").css("padding","1px").button().css("font-size","12px").attr('href','#').text(text).appendTo(div);
link.attr('val',val_array[i]);
var f = function(){$('#'+target).val($(this).attr('val'));$( "#dialog" ).dialog( "close" );};
link.click(f);
div.appendTo(menu);
}
menu.appendTo(dialog);
menu.menu();
$('#dialog').attr('title','Open Dialog');
$( "#dialog" ).dialog({
autoOpen: false,
buttons: {
"清空": function() {
var target = opener.attr('target');
$('#'+target).val('');
$( this ).dialog( "close" );
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
$( "#opener" ).click(function() {
$( "#dialog" ).dialog( "open" );
return false;
});
});