javascript - 用点击链接替换 img
问题描述
我有 3 个 img pic 和 3 个链接。每个链接都有自己的图片。我想在点击链接时替换图片。现在它替换但它重新启动窗口。我不想重启。
<div class="home-actions" >
<img class="home-actions__img" src="{{asset('images/ohdaihiep/block3/bg3_1.jpg')}}" alt="" id="my_image" >
<a href="#" id="my_a" class="home-actions__bg3-1" ></a>
<a href="#" id="my_a2" class="home-actions__bg3-2" ></a>
<a href="#" id="my_a3" class="home-actions__bg3-3" ></a>
</div>
还有我的 jQuery 代码
$(function () {
$("#my_a").bind("click", function () {
$("#my_image").attr("src", "images/ohdaihiep/block3/bg3_1.jpg");
});
$("#my_a2").bind("click", function () {
$("#my_image").attr("src", "images/ohdaihiep/block3/bg3_2.png");
});
$("#my_a3").bind("click", function () {
$("#my_image").attr("src", "images/ohdaihiep/block3/bg3_3.jpg");
});
解决方案
这就是它不会重新启动的方式
$("#my_a").bind("click", function(event) {
event.preventDefault();
$("#my_image").attr("src","images/ohdaihiep/block3/bg3_1.jpg");
});
$("#my_a2").bind("click", function(event) {
event.preventDefault();
$("#my_image").attr("src","images/ohdaihiep/block3/bg3_2.png");
});
$("#my_a3").bind("click", function(event) {
event.preventDefault();
$("#my_image").attr("src","images/ohdaihiep/block3/bg3_3.jpg");
});
推荐阅读
- undefined - Stripe 和 back4app:无法读取未定义的属性“id”
- mysql - MySQL in 子句慢,有 10 个或更多项目
- magento-1.9 - Magento 1.9,修改Category下已有的Label
- matlab - 如何在matlab中将二维形状划分为大约相等大小的块?
- vba - 来自动态添加的组合框的 VBA 值
- node.js - 如何将数据保存到猫鼬模式中的数组对象?
- linux - 在不重启系统的情况下设置 Linux 代理
- ssl - Kubernetes:Ingress 上的 TLS;主机使用错误的证书
- ios - EXC_BREAKPOINT 来自 -[FIRUser parseIDToken:error:]
- c# - 在 GridView 中删除