jQuery Mobile中$.mobile.buttonMarkup方法使用具体解释

Posted 2020-09-21 zhchoutai

近期在群里遇到多数网友提到$.mobile.buttonMarkup()方法的使用。

我这里就列了一下api的使用说明，以后大家看博客就能解决这个问题。如有不对的地方，请留言指出！

jQuery Mobile暴露的方法都是使用$.mobile来引用。
$.mobile.buttonMarkup( options, overwriteClasses ) 加入按钮的样式元素
当中options为对象,overwriteClasses为布尔类型，默觉得false。当设置为true，buttonmarkup()丢弃全部样式。相反。当设置为false。在当前已经存在的样式基础上添加样式。

options对象的属性解释例如以下：
corners属性：设置圆角，布尔类型。默觉得true。

当为true时添加ui-corner-all样式。当为false是删除ui-corner-all样式。

它的使用类似于data-corners="false"。

icon属性：设置图标，字符串类型，默觉得""。它的使用类似于data-icon="arrow-r"。和class加入"ui-icon-"属性类似。

iconpos属性：设置图标位置，字符串类型，默觉得"left"。它的使用类似于data-iconpos="right"。和class加入"ui-btn-icon-"属性类似。

iconshadow属性：设置阴影图标。布尔类型。默觉得false。这个选项是使用1.4.0将会被删除在1.5.0。

它的使用类似于data-iconshadow="true"。和class加入"ui-shadow-icon"属性类似。
inline属性：设置元素的行内样式，布尔类型，默觉得false。它的使用类似于data-inline="true"。和class加入"ui-btn-inline"属性类似。
mini属性：设置元素的较小样式，布尔类型，默觉得false。它的使用类似于data-mini="true"。和class加入"ui-mini"属性类似。
shadow属性：设置元素的阴影，布尔类型。默觉得true。它的使用类似于data-shadow="false"。和class加入"ui-shadow"属性类似。
theme属性：设置主题，默觉得null,继承自父元素，字符串类型。

它的使用类似于data-theme="b"。

和class加入"ui-btn-"属性类似。如：ui-btn-b。
例如以下使用：
$("#myAnchor").buttonMarkup({corners:false});//取消圆角
$("#myAnchor").buttonMarkup({shadow:false});//设置阴影
$("#myAnchor").buttonMarkup({corners:true});//设置圆角

如有不懂，请加qq群：135430763共同学习！