radio单选按钮选中时当前页面实现跳转

最新推荐文章于 2022-12-22 11:55:37 发布

原创

最新推荐文章于 2022-12-22 11:55:37 发布 · 8.8k 阅读

15 ·

CC 4.0 BY-SA版权

文章标签：

#radio #当前页面跳转 #js实现页面跳转

本文介绍了一种使用JavaScript实现radio单选按钮选中时在当前页面跳转的方法。通过监听input[type=radio][name=chart]的change事件，根据不同的value值，利用window.location.href更改页面URL，分别跳转到'overallSituation'、'interfaceUse'和'areaSituation'等页面。

例如下面是一个单选的span片段：

<input type="radio" name="chart" value="overAll" checked="checked"/>总体概况
<input type="radio" name="chart" value="interfaceUse" style="margin-left:35px"/>利用统计
<input type="radio" name="chart" value="area" style="margin-left:35px"/>地区统计

</span>

当改变checked属性时在当前页面实现跳转js实现如下：

$('input[type=radio][name=chart]').change(function() {
if (this.value == 'overAll') {
window.location.href="${pageContext.request.contextPath}/statisticalAnalysis/overallSituation";
}else if (this.v