6,按钮,进度条,进度条跳动

一,按钮 :

1 ,按钮 :

$("#btn01").linkbutton()

2 ,禁用按钮 :

  1. 代码 :
$("#btn01").linkbutton({
    disabled:true
})
  1. 效果 :
    按钮变灰了

3 ,按钮变成复选框的样子 :

  1. 代码 :
$(".btn").linkbutton({
    toggle:true,
})

<a class="btn">按钮1</a>
<a class="btn">按钮2</a>
  1. 效果 :
    在这里插入图片描述
  2. 默认选中 : selected:true
$(".btn").linkbutton({
    toggle:true,
    //  默认选中
    selected:true
})

4 ,按钮的图标 :

  1. 代码 :
$("#btn1").linkbutton({
	iconCls:"icon-add",
	iconAlign:"right"
})
$("#btn2").linkbutton({
text:"我是小按钮",
    iconCls:"icon-mini-add",
    iconAlign:"right"
})
  1. 效果 :
    在这里插入图片描述

二,进度条 :

1 ,进度条 :

  1. 代码 :
$("#jdt").progressbar({
	width:500,
	height:20,
	value:60,
	//	文字显示模板
	text:"{value}%"
})
<div id="jdt"></div>
  1. 效果 :
    在这里插入图片描述

2 ,进度条跳动 :

$("#jdt").progressbar({
	width:500,
	height:20,
	value:0,
	//	文字显示模板
	text:"{value}%"
})
var i = 1
var interval = setInterval(function () {
       $("#jdt").progressbar("setValue",i)
		i+=1
		if(i>100){
		          window.clearInterval(interval)
		}
},40);
发布了472 篇原创文章 · 获赞 25 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/qq_34319644/article/details/104156456