JQuery中点击超链接动态修改url连接地址无效
2024-09-29 22:52:58
这篇随笔的标题真是好拗口,想表达的意思是,当点击超链接后,才去修改超链接的地址,此时超链接仍然链接的是是修改之前的页面,而不是修改之后的页面。
超链接代码如下:
<a id="chao1" href="http://www.{0}.com" >我是度娘</a>
看到了吗?度娘并不是度娘,而是{0},之后的代码,就是用‘baidu’代替{0},代码如下:
$("#chao1").click(function (event) {
var htm = $("#div1").html();
htm = htm.replace("{0}", "baidu");
$("#div1").html(htm); });
经过上面的三条语句,超链接的地址虽然被置换成了“www.baidu.com",但是然并卵。浏览器的地址栏如图:
卧槽,我改了半天你就给我看这个,于是我考虑采用直接跳转的方式:ASP.NET MVC中如何实现页面跳转中的第二点,代码如下:
$("#chao1").click(function (event) {
var htm = $("#div1").html();
htm = htm.replace("{0}", "baidu");
$("#div1").html(htm);
window.location = $("#chao1").attr("href");
});
我尼玛,链接的依然是上面那个然并卵的地址,于是我想到了第三种方案,阻止超链接的跳转,只让window.location起作用,代码如下:
$("#chao1").click(function (event) {
event.preventDefault();
var htm = $("#div1").html();
htm = htm.replace("{0}", "baidu");
$("#div1").html(htm);
window.location = $("#chao1").attr("href");
});
果然,度娘还是爱我的,如图:
注意 preventDefault()用来阻止元素的默认事件:随手抛链接学习一下
可能会有小伙伴会问,怎么可能会有这么奇葩的需求,在点击超链接的时候,才去修改href,可是po主确实是遇到了,po主找到的临时的解决方案是,在每个可能改变href的地方,都变化href,而上面的解决方案,一次解决。
最新文章
- Zend Framework 1 - Quick Start
- Velocity教程【转】
- hadoop2.2.0伪分布式搭建
- 高性能web站点建设(一)
- CF 121E Lucky Array 【树状数组】
- struts2之动态方法调用(转)
- Bootstrap的文档大概介绍
- java 匿名对象,内部类,修饰符,代码块
- 20172328 2018—2019《Java软件结构与数据结构》第二周学习总结
- 20165337实验三——敏捷开发与XP实践
- 生成命令行接口--google开源的fire使用体验【python-fire】
- create react app遇到的问题
- 023 SpringMVC拦截器
- 【Scheme】元循环求值
- Go语言实现数据结构(一)单链表
- javascript报错集锦
- Vue 介绍
- 【bzoj4520】 Cqoi2016—K远点对
- MySQL 5.7 免安装版配置
- mac下安装c++开发环境
热门文章
- O(nlogn)求逆序数对的个数
- 使用SpringCloud-Netflix
- Ubuntu 解决E: 无法获得锁 /var/lib/dpkg/lock - open (11: 资源暂时不可用)
- 【Linux】Tmux分屏
- ScrollView中嵌套ListView时,listview高度显示的问题
- CPU性能的评价
- xp密钥
- bat 符号说明
- ubuntu 14.04 配置java 1.8环境变量
- org.springframework.beans.factory.BeanCreationException: Could not autowire