JavaScript实现点击单选按钮跳转指定网址

作者:青柠时间:2026-10-29 13:38:15浏览:480

本文介绍利用JavaScript实现点击单选按钮后自动跳转至指定网址的功能。通过定义go函数修改window.location.href,结合radio按钮的onClick事件,用户选择不同选项即可访问对应链接。

JavaScript单选按钮跳转实现

本文详细介绍如何使用JavaScript实现点击单选按钮后自动跳转至对应网址的功能,供读者参考学习。

该示例展示了一个交互特效:当用户点击单选按钮时,链接被激活并跳转到指定网址。核心功能由onClick事件触发,配合自定义函数实现,开发者可基于此扩展更多按钮交互效果。

运行效果截图如下:

JavaScript单选按钮跳转实现

具体代码如下:


<html>
<head>
<title>点击文本框激活链接转向某网址</title>
<SCRIPT>
function go(loc) {
window.location.href = loc;
}
</script>
</head>
<body>
<form name="form">
 <div align="center">
  <input type="radio" name="loc" onClick="go('http://www.baidu.com');">
  百度搜索<br>
  <input type="radio" name="loc" onClick="go('https://www.jb51.net');">
  本站<br>
  <input type="radio" name="loc" onClick="go('http://www.qq.com');">
  腾讯QQ<br>
 </div>
</form>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

作者最新文章