本文目录一览:
- 1、js怎么实现三个按钮点击那个那个更换样式
- 2、如何用js模拟点击class样式的按钮
- 3、如何用js里给按钮改变样式
- 4、JS 或者Jquery怎么实现:点击一个按钮之后鼠标样式改变,然后单击一次之后变回正常形状
js怎么实现三个按钮点击那个那个更换样式
可以尝试以下操作:
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
titlejs控制按钮样式切换/title
link href="css/my.css" rel="stylesheet"
/head
script type="text/javascript"
//左边按钮的点击事件
window.onload = function(){
var arr = document.getElementsByTagName('button');
for(var i = 0;iarr.length;i++){
arr[i].onclick = function(){
//this是当前激活的按钮,在这里可以写对应的操作
if(this.className == 'btn1'){
this.className = 'btn2';
var name = this.id;
var btn = document.getElementsByClassName('btn2');
for(var j=0;jbtn.length;j++){
if(btn[j].id!=name){
btn[j].className = 'btn1';
}
}
}
}
}
}
/script
body
div id="main" style="margin:auto 0"
!--四个按钮--
div style="margin-top:2em;"
div style="width:20%"button id = "1" type = "button" 按钮1/button/div
div style="width:20%"button id = "2" type = "button" 按钮2/button/div
div style="width:20%"button id = "3" type = "button" 按钮3/button/div
div style="width:20%"button id = "4" type ="button" 按钮4/button/div
/div
/div
/body
/html
如何用js模拟点击class样式的按钮
元素选择: $("a").click(function(){})
类:$(".tj_btn").click(function(){})
如何用js里给按钮改变样式
不能直接改,不过可以模拟:
上面就是做个自定义样式的button,点击时触发隐藏的file文本域。
JS 或者Jquery怎么实现:点击一个按钮之后鼠标样式改变,然后单击一次之后变回正常形状
直接修改元素的cursor属性呀!例如你要修改body的cursor属性
$("button#1").bind('click',function(){
if($("body").css('cursor')=='crosshair'){
("body").css('cursor','default');
}else{
("body").css('cursor','crosshair');
}
})
然后你要将这个鼠标样式应用到哪一个元素上,就修改这个元素的cursor就ok了