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与flash交互通信基础教程
Aug 07 Javascript
jQuery 动画基础教程
Dec 25 Javascript
JSON扫盲帖 JSON.as类教程
Feb 16 Javascript
asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
Sep 19 Javascript
javascript:;与javascript:void(0)使用介绍
Jun 05 Javascript
js实现密码强度检验
Jan 15 Javascript
shiro授权的实现原理
Sep 21 Javascript
Vue 按键修饰符处理事件的方法
May 04 Javascript
微信小程序 checkbox使用实例解析
Sep 09 Javascript
webpack proxy 使用(代理的使用)
Jan 10 Javascript
TypeScript 运行时类型检查补充工具
Sep 28 Javascript
Js数组扁平化实现方法代码总汇
Nov 11 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数组的一些常见操作汇总
2011/07/17 PHP
shell脚本作为保证PHP脚本不挂掉的守护进程实例分享
2013/07/15 PHP
Laravel 5框架学习之向视图传送数据
2015/04/08 PHP
laravel 5.5 关闭token的3种实现方式
2019/10/24 PHP
Javascript中的变量使用说明
2010/05/18 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
jquery动态改变form属性提交表单
2014/06/03 Javascript
jQuery如何使用自动触发事件trigger
2015/11/29 Javascript
jquery结合html实现中英文页面切换
2016/11/29 Javascript
使用JS获取SessionStorage的值
2018/01/12 Javascript
详解webpack模块化管理和打包工具
2018/04/21 Javascript
JavaScript继承定义与用法实践分析
2018/05/28 Javascript
jQuery基于Ajax实现读取XML数据功能示例
2018/05/31 jQuery
vue cli2.0单页面title修改方法
2018/06/07 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
2019/05/01 Javascript
vue.js实现只能输入数字的输入框
2019/10/19 Javascript
微信域名检测接口调用演示步骤(含PHP、Python)
2019/12/08 Javascript
vue+Element-ui实现分页效果
2020/11/15 Javascript
Python跳出循环语句continue与break的区别
2014/08/25 Python
使用PDB模式调试Python程序介绍
2015/04/05 Python
Python基于pygame模块播放MP3的方法示例
2017/09/30 Python
Python实现判断一个字符串是否包含子串的方法总结
2017/11/21 Python
mac下如何将python2.7改为python3
2018/07/13 Python
Python中py文件转换成exe可执行文件的方法
2019/06/14 Python
Python flask框架post接口调用示例
2019/07/03 Python
python对象转字典的两种实现方式示例
2019/11/07 Python
CSS3田字格列表的样式编写方法
2018/11/22 HTML / CSS
Strawberrynet草莓网新加坡站:护肤、彩妆、香水及美发产品
2018/08/31 全球购物
金融专业推荐信
2013/11/14 职场文书
寄语学生的话
2014/04/10 职场文书
《欢乐的泼水节》教学反思
2014/04/22 职场文书
考试诚信承诺书
2014/05/23 职场文书
专题民主生活会对照检查材料思想汇报
2014/09/29 职场文书
财务人员个人工作总结
2015/02/27 职场文书
单位证明范文
2015/06/18 职场文书
Jupyter notebook 输出部分显示不全的解决方案
2021/04/24 Python