jqModal不工作

时间:2012-11-08 00:47:10

标签: javascript html jqmodal

我试图测试http://dev.iceburg.net/jquery/jqModal/中的一些工作代码,以了解其工作原理,但我无法让代码工作。我正在尝试使用弹出对话框部分,我正在测试默认值中的代码,这是示例部分中的第一个示例。这是我复制并尝试测试的内容。不起作用的部分是弹出的对话框。我收到错误说....未捕获的ReferenceError:$未定义

<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>

1 个答案:

答案 0 :(得分:0)

如果您的代码确实是您的整个HTML,那么未定义$的原因是您没有包含jQuery(它定义了$并将其用作速记)。您的代码既不包含jQuery库也不包含jqModal脚本。 (不可否认,jqModal网站上的所有示例都是摘录而不是完整代码,所以他们认为这一步是理所当然的。)

添加

<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>

<head>中,根据需要调整jQModal.js的路径。