jQuery UI 实例 - 进度条(Progressbar)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI 实例 - 进度条(Progressbar)</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<style>
#progressbar { margin-top: 10px; }
</style>
</head>
<body>
<div id="progressbar"></div>
<script>
$(function() {
$("#progressbar").progressbar({
value: 37
});
});
</script>
</body>
</html>
这段代码展示了如何使用jQuery UI库中的Progressbar部件创建一个基本的进度条。在页面加载完毕后,通过jQuery的id选择器找到id为progressbar
的元素,并初始化为进度条,同时设置其初始值为37。这个简单的例子展示了如何使用jQuery UI创建一个动态的用户界面元素。
评论已关闭