jQuery 单击按钮打开 js 弹出窗口
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16692695/
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
open js popup by clicking a button
提问by shmnsw
i have index html page in my site, its the main page. in the index html i have a button and by clicking it i want to open a popup form, i have the js file and css file of this popup included in the index html.
我的网站中有索引 html 页面，它是主页。在索引 html 中，我有一个按钮，通过单击它我想打开一个弹出窗体，我将这个弹出窗口的 js 文件和 css 文件包含在索引 html 中。
i just cant open this animated popup by clicking the input type button.. can anyone help me?
我只是无法通过单击输入类型按钮来打开这个动画弹出窗口.. 谁能帮我？
the clouds js:
$(function ()
{
// Register Smart skin.
$.speedoPopup.registerSmartSkin('clouds', function (overlay, container)
{
// We don't want to brake anything if there is no overlay.
if (!overlay)
{
return ;
}
if ($.speedoPopup.browser_ie && $.speedoPopup.browser_ie< 9)
{
return;
}
var clouds = '<div class="cloud x1"></div><div class="cloud x2"></div><div class="cloud x3"></div><div class="cloud x4"></div><div class="cloud x5"></div>';
overlay.append(clouds);
});
});
index html: below the head tag
index html：head 标签下方
<link type='text/css' href='clouds/clouds.css' rel='stylesheet' media='screen' />
<script type='text/javascript' src='clouds/clouds.js'></script>
and the button:
和按钮：
<div>
<input type='button' name='clouds' value='Clouds'/>
</div>
采纳答案by U.P
You have to invoke the dialog on click
您必须在单击时调用对话框
Lets give you button an id
让我们给你按钮一个 id
<div>
<input id="btnDialog" type='button' name='clouds' value='Clouds'/>
</div>
Now create a div that you want to show in dialog
现在创建一个要在对话框中显示的 div
<div id="divContentToPopup">
...content here...
</div>
now you have to hook a click event on it
现在你必须在它上面钩一个点击事件
$('#btnDialog').click(function ()
{
$(this).speedoPopup(
{
width:550,
height:265,
useFrame: TRUE,
href: '#divContentToPopup'
});
});
