首页 > 其他分享 >radio单选按钮选中时当前页面实现跳转

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

时间:2023-12-12 19:34:48浏览次数:29  
标签:www value window href radio location 跳转 单选

下面是一个单选的span标签:

<span style="width: 500px;">
    <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="www.sougou.com";
    }else if (this.value == 'interfaceUse') {
    		window.location.href="www.baidu.com";
    }else if(this.value == 'area'){
    		window.location.href="www.firefox.com.cn";
    }
});

因为使用的是本地路径所以跳转不进去,你们可以不使用本地路径

标签:www,value,window,href,radio,location,跳转,单选
From: https://blog.51cto.com/u_16281588/8790156

相关文章

  • H5网页跳转微信小程序
    获取scheme码该接口用于获取小程序scheme码,适用于短信、邮件、外部网页、微信内等拉起小程序的业务场景。目前仅针对国内非个人主体的小程序开放,详见获取URLscheme。 效果:https://www.youlingrc.com/minishare.html项目地址:https://github.com/yusheng9/openwxchat H......
  • 封装单选框
    <template><divclass="radioButtons"><labelv-for="optioninoptions":class="{'is-selected':selectedValue===option.value}":key="option.valu......
  • 汇编-JC进位跳转
    进位标志位CF=1就跳转.386.modelflat,stdcalloptioncasemap:none.stack4096IncludeIrvine32.incincludelibIrvine32.libExitProcessPROTO,dwExitCode:DWORD.data.codemainPROCstc;CF置1cf=1jct1......
  • nginx 反向代理实现不同来路IP跳转到不同网站服务器
    http{#定义一个map,将来路IP映射到后端服务器map$remote_addr$backend_server{defaultserver1;192.168.1.1server2;#添加更多的IP地址映射}server{listen80;#使用if语句根据来路IP选择后......
  • 鸿蒙Watch 页面跳转
    新建页面config.json回自动注册添加跳转<buttontype="capsule"onclick="toStatusMonitor">状态检测</button>写跳转方法importrouterfrom'@system.router';exportdefault{data:{},onInit(){},onShow(){},......
  • js获取当前页面域名判断跳转网址输出不同内容
    js代码可以实现一些html语言无法实现的功能,比如通过js代码获取当前访问的域名。通过js代码判断当前访问域名可以进行跳转等功能。js获取当前页面域名判断跳转网址代码:<scripttype="text/javascript"> host=window.location.host;if(host=="www.adminwl.com") { window.loca......
  • 『江鸟中原』鸿蒙——设计聊天软件界面并实现登录跳转
    环境搭建软件要求 DevEcoStudio版本:DevEcoStudio4.0Beta1BuildVersion:4.0.0.201,builtonJune10,2023。 HarmonyOSSDK版本:APIversion9。硬件要求设备类型:华为手机或运行在DevEcoStudio上的华为手机设备模拟器。HarmonyOS系统:3.1.0DeveloperRelease。简要介......
  • Vue 3中的路由跳转及在新标签页中打开链接
    前言在Vue3中,VueRouter是一个常用的路由管理库,它提供了一种简单而强大的方式来实现路由跳转和导航。本文将介绍如何在Vue3中设置路由跳转,并且重点讨论如何在新标签页中打开链接。步骤一:安装VueRouter首先,我们需要安装VueRouter。在命令行中执行以下命令:npminstallvue-ro......
  • 04 Frame控件和跳转
    04Frame控件和跳转Frame控件Frame是一个内容控件,提供导航到和显示内容的功能。Frame可以托管在其他内容中,就像其他控件和元素一样。常用属性Source设置该控件显示哪个资源,内容可以是任何类型的.NETFramework对象和HTML文件。但是,一般情况下,页面是打包内容以用于......
  • Tomcat-idea使用tomcat创建web项目-跳转网页出现乱码
    Tomcat-idea使用tomcat创建web项目-跳转网页出现乱码:1..jsp内的中文跳转网页后出现以下情况:2. 看下图内容是否缺少重要内容:  若没有:将代码copy进.jsp此处: <%@pagecontentType="text/html;charset=UTF-8"language="java"%>   这是解决方式......