jqm之button

 

• 如果希望把a转换渲染成按钮？

Html代码  

1. //添加data-role属性为button，默认会变成块级元素  
2. <a data-role="button">其实我是一个按钮</a>  

 

• 如果希望把上面的转换成内联？

Html代码  

1. //增加一个data-inline的属性值为true  
2. <a data-role="button" data-inline="true">其实我是一个内联的按钮</a>  

 

• 自动初始化渲染的按钮标签包含哪些？

Html代码  

1. //其实和initSelector指定有关系  
2. //initSelector:"button,[type='button',[type='submit'],[type='reset'],[type='image']]";  
3.   
4. <button>Button</button>  
5. <input type="button"  value="input button" />  
6. <input type="submit" value="input submit" />  
7. <input type="reset" value="input reset" />  
8. <input type="image" value="input image" />  

 

• 如果想禁用自动初始化？

Js代码  

1. <button data-role="none">button不自动初始化</button>  

 

• 如果想增加主题c？

Html代码  

1. <button data-theme="c">我是有主题c的按钮</button>  

 

•  想要加点图标？

Js代码  

1. //data-icon属性来指定图标，比如值为home  
2. <button data-icon="home">是是一个带图标home的按钮</button>  

 

    效果图：

 

       
 

 

• 想要设置图标的位置？

Html代码  

1. //用data-iconpos来设置图标的位置，默认是left，也可以设置top|right|bottom  
2. <button data-icon="home" data-iconpos="top">是是一个带图标home的按钮</button>  

 

    效果图：

 

     
 

 

• 想要不显示文字，只有图标？

Html代码  

1. //设置data-iconpos为notext  
2. <button data-icon="home" data-iconpos="notext">是是一个带图标home的按钮，只有图标没有文字</button>