mik*_*ebz 7 javascript jquery jquery-ui
这是一个总的n00b问题.我正在尝试使用JQuery UI,似乎JQuery CSS在我的HTML文件中没有任何区别.
以下是我采取的步骤:1)挑选出一个主题并包含一个链接(我尝试了远程和本地)
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-darkness/jquery-ui.css" type="text/css" rel="stylesheet" >
Run Code Online (Sandbox Code Playgroud)
2)为按钮设置一个类来使用主题:
<button class="ui-button" id='button 1'>hello world</button>
Run Code Online (Sandbox Code Playgroud)
在这个时间点,我认为这就是它所需要的一切.我阅读了一些教程,他们都认为所有主题都是开箱即用的,主要集中在调整它们.
入门的最低要求是什么?
最终的HTML文档:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery demo</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-darkness/jquery-ui.css" type="text/css" rel="stylesheet" >
<style>
a.test { font-weight: bold; }
</style>
</head>
<body>
<a href="http://jquery.com/">jQuery</a>
<button class="ui-button" id='button 1'>hello world</button>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
$(document).ready(function(){
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
你已经加载了jQuery脚本,但没有加载jQuery-UI脚本.(除了jQuery本身,jQuery-UI还需要CSS和JS文件.)
将您的<script>代码更改为:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function(){
});
</script>
Run Code Online (Sandbox Code Playgroud)