Fatal编程技术网

Javascript jqModal不工作

javascript html

Javascript jqModal不工作,javascript,html,jqmodal,Javascript,Html,Jqmodal,我试图测试一些来自的工作代码，以了解其工作原理，但我无法让代码正常工作。我正在尝试使用弹出对话框部分，并从默认值测试代码，这是示例部分的第一个示例。以下是我复制并尝试测试的内容。不工作的部分是弹出的对话框。我收到一个错误，说。。。。未捕获引用错误：$未定义 <html> <head> <title> test </title> <style type = "text/css"> .jqmWindow { display:none

我试图测试一些来自的工作代码，以了解其工作原理，但我无法让代码正常工作。我正在尝试使用弹出对话框部分，并从默认值测试代码，这是示例部分的第一个示例。以下是我复制并尝试测试的内容。不工作的部分是弹出的对话框。我收到一个错误，说。。。。未捕获引用错误：$未定义

<html>

<head>
<title> test </title>

<style type = "text/css">


.jqmWindow {
display:none;

position: fixed;
top: 17%;
left: 50%;

margin-left: -300px;
width: 600px;

background-color: #EEE;
color: #333;
border: 1px solid black;
padding: 12px;
}

.jqmOverlay { background-color: #000; }


# html .jqmWindow {
 position: absolute;
 top: expression((document.documentElement.scrollTop || document.body.scrollTop) +     Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}

</style>

<script type = "text/javascript">
$().ready(function() {
$('#dialog').jqm();
});

</script>
</head>

<body>

<a href="#" class="jqModal">view</a>
...
<div class="jqmWindow" id="dialog">

<a href="#" class="jqmClose">Close</a>
<hr>
<em>READ ME</em> -->
This is a "vanilla plain" jqModal window. Behavior and appeareance extend far beyond   this.
The demonstrations on this page will show off a few possibilites. I recommend walking
through each one to get an understanding of jqModal <em>before</em> using it.

<br /><br />
You can view the sourcecode of examples by clicking the Javascript, CSS, and HTML tabs.
Be sure to checkout the <a href="README">documentation</a> too!

<br /><br />
<em>NOTE</em>; You can close windows by clicking the tinted background known as the  "overlay".
Clicking the overlay will have no effect if the "modal" parameter is passed, or if the
overlay is disabled.
</div>


</body>
</html>


试验
.jqmWindow{
显示：无；
位置：固定；
最高：17%；
左：50%；
左边距：-300px；
宽度：600px；
背景色：#EEE；
颜色：#333；
边框：1px纯黑；
填充：12px；
}
.jqmolay{背景色：#000；}
#jqmWindow{
位置：绝对位置；
顶部：表达式（（document.documentElement.scrollTop | | document.body.scrollTop）+Math.round（17*（document.documentElement.offsetHeight | | document.body.clientHeight）/100）+“px”）；
}
$（）.ready（函数（））{
$（'#dialog'）.jqm（）；
});
...


读我-->
这是一个“香草平原”jqModal窗口。行为和外表远远不止于此。
本页上的演示将展示一些可能性。我建议步行
在使用jqModal之前，通过每一个步骤了解jqModal。



您可以通过单击Javascript、CSS和HTML选项卡来查看示例的源代码。
一定要结帐了！



注；您可以通过单击称为“覆盖”的着色背景来关闭窗口。
如果传递了“modal”参数，或者
覆盖被禁用。
如果您的代码确实是整个HTML，那么未定义$的原因是您没有包含jQuery（jQuery定义了$，并且经常将其用作速记）。您的代码既不包括jQuery库，也不包括jqModal脚本。（无可否认，jqModal站点上的所有示例都是摘录而非完整代码，因此他们认为这一步是理所当然的。）

加
在
中，根据需要调整jQModal.js的路径

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="/assets/js/jqModal.js"></script>