分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

jquery mobile - 按钮

发布时间:2023-09-06 01:16责任编辑:赖小花关键词:暂无标签

jquery mobile(以下简称 jm)中提供了一些按钮的样式,让开发者使用起来更方便。

jm的按钮可由3种形式创建,

  • 使用<button>元素
  • 使用<input>元素
  • 使用data-role="button"的a元素

tip:jQuery Mobile 中的按钮会自动获得样式,这增强了他们在移动设备上的交互性和可用性。我们推荐您使用 data-role="button" 的 <a> 元素来创建页面之间的链接,而 <input> 或 <button> 元素用于表单提交。

默认情况下,按钮会占据屏幕的全部宽度。如果您需要按钮适应其内容,或者如果您需要两个或多个按钮并排显示,data-inline="true" 将按钮变为行内按钮

请将 data-role="controlgroup" 属性与 data-type="horizontal|vertical" 一同使用,以规定水平或垂直地组合按钮

demo:
<div data-role="controlgroup" data-type="horizontal"> ??---》默认情况下,组合按钮是垂直分组的,彼此间没有外边距和空白。并且只有第一个和最后一个按钮拥有圆角。 ?<a href="#anylink" data-role="button">按钮 1</a> ?<a href="#anylink" data-role="button">按钮 2</a> ?<a href="#anylink" data-role="button">按钮 3</a>
</div>
后退按钮:用data-rel="back" 属性(会忽略锚的 href 值)
jm中还可以给按钮添加图标:
data-icon="。。。" 

data-iconpos="left|top|right|bottom" ?定义按钮图标的位置(相对于按钮中的文字),默认靠左。当值为notext的时候,按钮没有文字,只有图标



jquery mobile - 按钮

原文地址:http://www.cnblogs.com/hy-blogs/p/7645645.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved