多个按钮点击为选择状态

最新推荐文章于 2023-02-20 16:31:57 发布

北刘庄我最帅

最新推荐文章于 2023-02-20 16:31:57 发布

阅读量1.5k

点赞数

本文链接：https://blog.csdn.net/weixin_34849724/article/details/80660981

版权

<html>
<head>
<meta charset="utf-8">
<style>
<style>
.hq_hy:hover, .hq_zsh:hover, .hq_hb:hover, .hq_jyyc:hover, .hq_byb:hover, .hq_lrcl:hover
　　/*鼠标移上去变色（不点击）*/
{
color: #fff;
border-color: #b1b0b0;
background: #b1b0b0;
border: none;
}

.start
{
cursor: pointer;
}

.end
{
cursor: pointer;
color: #fff;
background: #b1b0b0;
border: none;
}
</style>
</style>
</head>
<script src='jquery1.12.4.min.js'></script>
<body>
<table>
<tr>
<td>
<input class="flag" type="submit" οnclick="dj(this);" value="行业" />
</td>
<td>
<input class="flag" type="submit" οnclick="dj(this);" value="指数" />
</td>
<td>
<input class="flag" type="submit" οnclick="dj(this);" value="货币" />
</td>
<td>
<input class="flag" type="submit" οnclick="dj(this);" value="交易异常" />
</td>
<td>
<input class="flag" type="submit" οnclick="dj(this);" value="比一比" />
</td>
<td>
<input class="flag" type="submit" style="" οnclick="dj(this);" value="ETF两融策略" />
</td>
</tr>
</table>
<div id='hh' style='display:none;'>45465</div>

</body>
<script type="text/javascript">
$("#hh").show()
$(function () {
//加载事件
var collection = $(".flag");
$.each(collection, function () {
$(this).addClass("start");
});
});
//单击事件
function dj(dom) {
var collection = $(".flag");
$.each(collection, function () {
$(this).removeClass("end");
$(this).addClass("start");
});
$(dom).removeClass("start");
$(dom).addClass("end");

}

</script>

北刘庄我最帅

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
多个按钮点击为选择状态

&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;style&gt; &lt;style&gt;.hq_hy:hover, .hq_zsh:hover, .hq_hb:hover, .hq_jyyc:hover, .hq_byb:hover, .hq_lrcl:hover　　/*鼠标移上去变色（不点击）*/ ...
复制链接

扫一扫