目标是当我单击一个按钮时，将调用一个 javascript 函数。javascript 函数内部是 div 标签/元素，我想像弹出窗口一样显示它们。
JavaScript：
$("#button").click(
openPopUP();
);
function openPopUP(){
var window = "<div class = 'box'>";
window += "Will be display as a pop up";
window += "</div>";
}
当我单击按钮时，我知道该函数已被调用，但框/窗口未出现在我的 html 页面上。帮助！
<body>
<div id="name">backtrack</div>
<button onClick="popUp();">click here</button>
</body>
和java脚本是
function popUp(){
var popup = document.createElement('div');
popup.className = 'popup';
popup.id = 'test';
var cancel = document.createElement('div');
cancel.className = 'cancel';
cancel.innerHTML = 'close';
cancel.onclick = function (e) { popup.parentNode.removeChild(popup) };
var message = document.createElement('span');
message.innerHTML = document.getElementById("name").innerHTML;
popup.appendChild(message);
popup.appendChild(cancel);
document.body.appendChild(popup);
}
将需要显示为弹出窗口的 HTML 内容包装起来。
<div id="popup">
<!-- Your content here as pop up -->
</div>
然后使用JQuery 对话框
$(function() {
$( "#popup" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000
},
hide: {
effect: "explode",
duration: 1000
}
});
$( "#button" ).click(function() {
$( "#popup" ).dialog( "open" );
});
});
你的代码没有做任何事情来显示 div
显示 div 你可以使用
将您的变量win替换为window
$('body').append(win);