jQuery之按钮组件的深入解析


Posted in Javascript onJune 19, 2013

按钮组件:
     $(selector).button([options]);

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>ButtonIcon</title>
<link rel="stylesheet" type="text/css" href="themes/ui-lightness/jquery.ui.all.css"/>
<script type="text/javascript" src="JS/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="JS/jquery.ui.core.js"></script>
<script type="text/javascript" src="JS/jquery.ui.widget.js"></script>
<script type="text/javascript" src="JS/jquery.ui.button.js"></script>
<script>
$(document).ready(function(){
 $("input,button").button({
  icons: {
            primary: "ui-icon-locked"
    // secondary: "ui-icon-triangle-1-s"
        }
 });
 $("a,div").button({
  icons: {
            secondary: "ui-icon-triangle-1-s"
        }
 });
});
</script>
<style>
body{ padding:30px; font-size:9px; }
</style>
</head>
<body>
<input type="button" value="Button 1" />
<input type="submit" value="Submit Button" />
<button>Button 2</button>
<input type="checkbox" id="check1" /><label for="check1">Check 1</label>
<input type="radio" id="radio1" /><label for="radio1">Radio1</label>
<a>Anchor</a>
<div>DIV</div>
</body>
</html>

效果图:  jQuery之按钮组件的深入解析
Javascript 相关文章推荐
javascript 火狐(firefox)不显示本地图片问题解决
Jul 05 Javascript
两种简单实现菜单高亮显示的JS类代码
Jun 27 Javascript
jQuery实现瀑布流布局
Dec 12 Javascript
AngularJS入门教程之Scope(作用域)
Jul 27 Javascript
JavaScript模块化之使用requireJS按需加载
Apr 12 Javascript
JS数组交集、并集、差集的示例代码
Aug 23 Javascript
详解http访问解析流程原理
Oct 18 Javascript
mpvue写一个CPASS小程序的示例
Sep 04 Javascript
详解key在Vue列表渲染时究竟起到了什么作用
Apr 20 Javascript
WebSocket的简单介绍及应用
May 23 Javascript
vue+iview实现文件上传
Nov 17 Vue.js
js基础语法与maven项目配置教程案例
Jul 15 Javascript
jQuery之自动完成组件的深入解析
Jun 19 #Javascript
jQuery之折叠面板的深入解析
Jun 19 #Javascript
jQuery之选择组件的深入解析
Jun 19 #Javascript
解析DHTML,JavaScript,DOM,BOM以及WEB标准的描述
Jun 19 #Javascript
JavaScript中把数字转换为字符串的程序代码
Jun 19 #Javascript
解析JavaScript中的标签语句
Jun 19 #Javascript
解析window.open的使用方法总结
Jun 19 #Javascript
You might like
php不用正则采集速度探究总结
2008/03/24 PHP
php中file_get_contents与curl性能比较分析
2014/11/08 PHP
jQuery+php简单实现全选删除的方法
2016/11/28 PHP
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
PHP文件系统管理(实例讲解)
2017/09/19 PHP
PHP实现转盘抽奖算法分享
2020/04/15 PHP
背景音乐每次刷新都可以自动更换
2007/02/01 Javascript
基于jQuery的星级评分插件
2011/08/12 Javascript
javascript中的注释使用与注意事项小结
2011/09/20 Javascript
仿百度的关键词匹配搜索示例
2013/09/25 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
2013/12/10 Javascript
轻松创建nodejs服务器(2):nodejs服务器的构成分析
2014/12/18 NodeJs
javascript实现倒计时并弹窗提示特效
2015/06/05 Javascript
js实现的Easy Tabs选项卡用法实例
2015/09/06 Javascript
Angularjs为ng-click事件传递参数
2017/06/15 Javascript
基于jquery实现多选下拉列表
2017/08/02 jQuery
微信小程序学习笔记之获取位置信息操作图文详解
2019/03/29 Javascript
js瀑布流布局的实现
2020/06/28 Javascript
详解vue-router的导航钩子(导航守卫)
2020/11/02 Javascript
python sqlobject(mysql)中文乱码解决方法
2008/11/14 Python
Python排序算法实例代码
2017/08/10 Python
简单了解OpenCV是个什么东西
2017/11/10 Python
python实现图书管理系统
2018/03/12 Python
Python读取excel指定列生成指定sql脚本的方法
2018/11/28 Python
浅谈python的深浅拷贝以及fromkeys的用法
2019/03/08 Python
详解Numpy中的数组拼接、合并操作(concatenate, append, stack, hstack, vstack, r_, c_等)
2019/05/27 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
Python 3.6打包成EXE可执行程序的实现
2019/10/18 Python
英国天然保健品网站:Simply Supplements
2017/03/22 全球购物
学期自我鉴定范文
2013/10/01 职场文书
档案工作汇报材料
2014/08/21 职场文书
董事长岗位职责
2015/02/13 职场文书
Python提取PDF指定内容并生成新文件
2021/06/09 Python
Redis中缓存穿透/击穿/雪崩问题和解决方法
2021/12/04 Redis
USB TYPE-C 或将成为所有智能手机充电标准
2022/04/21 数码科技
python开发人人对战的五子棋小游戏
2022/05/02 Python