JS 用图片代替checkbox。以及实现单页面转换内容效果。

发布网友发布时间：2022-05-18 12:36

共2个回答

热心网友时间：2022-05-18 14:05

这是必然的了，因为ID的属性是唯一的，你这个效果不能用ID来响应，可以用类

热心网友时间：2022-05-18 15:23

1.可以用下面这种方式，注意的是src中的内容。

<script language="javascript">
function changeimg(obj){
//alert(window.location.href);
if(obj.src == 'http://localhost:8088/ABC/a1.jpg'){
obj.src = 'a2.jpg';
}else{

obj.src = 'a1.jpg';
}
}
</script>
<img src = 'a1.jpg' onClick ='changeimg(this)'>
2.最简单易懂的方式
<script language="javascript">
function changediv(obj){
div1 = document.getElementById(1);
div2 = document.getElementById(2);
div3 = document.getElementById(3);
if(obj== 1){
div1.style.display = '';
div2.style.display = 'none';
div3.style.display = 'none';
}
if(obj == 2){
div1.style.display = 'none';
div2.style.display = '';
div3.style.display = 'none';
}
if(obj == 3){
div1.style.display = 'none';
div2.style.display = 'none';
div3.style.display = '';
}
}
</script>
<button onClick ='changediv(1)'>全部订单</button>
<button onClick ='changediv(2)'>未付款</button>
<button onClick ='changediv(3)'>已付款</button>
<p>
<div id = '1' >全部订单</div>
<div id = '2' style = 'display:none'>未付款</div>
<div id = '3' style = 'display:none'>已付款</div>