Index.html和stylesheet.css运行良好,但是script.js无法工作(它提供了datepicker函数),为什么它无法正常工作。我调试了一段时间。任何人都可以帮助我吗?谢谢。
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Pick a Date</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<link rel='stylesheet' type='text/css' href='http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css'/>
<script type='text/javascript' src='script.js'></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
</head>
<body>
<div id="header">
<h2><br/>Select a Destination</h2>
</div>
<div class="left">
<p>Departing: <input type="text" id="departing"></p>
</div>
<div class="right">
<p>Returning: <input type="text" id="returning"></p>
</div><br/>
<div id="main">
<p>Destination: <select id="dropdown">
<option value="newyork">New York</option>
<option value="london">London</option>
<option value="beijing">Beijing</option>
<option value="moscow">Moscow</option>
</select></p>
<button>Submit</button>
</div>
</body>
</html>
stylesheet.css中:
body {
background-color: #d0e4fe;
}
h2 {
font-family: Verdana, Arial, sans-serif;
text-align: center;
color: #FFFFFF;
}
#header {
width: 100%;
height: 70px;
position: relative;
top: -40px;
background-color: #7FC7AF;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
p {
font-family: Verdana, Arial, sans-serif;
font-size: 1em;
}
.left {
position: relative;
top: -40px;
float: left;
}
.right {
position: relative;
top: -40px;
float: right;
}
#main {
position: relative;
top: 170px;
float: left;
}
的script.js:
$(document).ready(function() {
$("#departing").datepicker();
$("#returning").datepicker();
$("button").click(function() {
var selected = $("#dropdown option:selected").text();
var departing = $("#departing").val();
var returning = $("#returning").val();
if (departing === "" || returning === "") {
alert("Please select departing and returning dates.");
} else {
confirm("Would you like to go to " + selected + " on " + departing + " and return on " + returning + "?");
}
});
});
答案 0 :(得分:1)
您已添加。这将加载jquery-ui
<a href="login.php"><div id="register" class="lay2"><div id="registert">Sign In/Up</div></div>
但还需要包括
0) shut down service mysql56
1) go to C:\ProgramData\MySQL\MySQL Server 5.6
(note that ProgramData is a hidden folder)
2) look for file my.ini, open it and add one line skip-grant-tables below [mysqld],
save [mysqld]
skip-grant-tables
3) start service mysql56
4) by right, you can access the database, and use the query below to update the password
update mysql.user set password=PASSWORD('NEW PASSWORD') where user='root';
5) shun down the service again, remove the line skip-grant-tables save it, and start the service again. try to use the password you set to login.
将加载jquery。
在任何自定义js文件之前还包括jquery.min
我包含了2.2.0版本,您可以根据需要进行更改
ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js
答案 1 :(得分:1)
您的脚本没有按正确的顺序包含在内,并且它并不会显示您实际上包含jQuery本身。
所需的顺序应为:
此外,调试控制台可能会为您提供有用的错误消息,这些消息是在加载某些脚本时未定义某些内容的线索。这是一个尚未加载某些依赖脚本的线索。
答案 2 :(得分:1)
在自定义JQuery脚本之前包含JQuery脚本 像这样:
<head>
<title>Pick a Date</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<link rel='stylesheet' type='text/css' href='http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css'/>
<!-- You need this script too -->
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js' type='text/javascript'></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script type='text/javascript' src='script.js'></script>
</head>
这是因为您的自定义JS脚本使用JQuery中的函数,因此必须在自定义脚本之前加载它。
注意:建议在body标签的底部包含 Scipts。
另外,您需要在JQuery UI之前包含JQuery
答案 3 :(得分:0)
请记住,如果使用派生的jQuery库,则必须首先包含jQuery核心。我认为这就是缺失的东西。
您可以在此处找到它:https://code.jquery.com/