jQuery如何通过点击按钮实现图片的切换，和超链接地址的跳转？

我会带着你远行 2021-12-11 09:41 280阅读 0赞

**点击一张图片更换为另一张图片：**

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    	
    	<script type="text/javascript">
    	$(function(){
    		$("img").click(function(){
    			//prop方法是设置属性
    			$("img").prop("src","${pageContext.request.contextPath }/img/2.jpg");
    		});
    	});
    	</script>
      </head>
      
      <body>
      
        <img src="${pageContext.request.contextPath }/img/1.jpg" />
      </body>
    </html>

**jquery使用button按钮实现页面跳转程序如下：**

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    	
    	<script type="text/javascript">
    	//等页面加载完毕
    	$(function(){
    		//选择到value='点我'的input标签，给这个元素添加click事件
    		$("input[value=点我]").click(function(){
    			/*$("a").html("新浪");
    			$("a").prop("href","http://www.sina.com");*/
    			//链式写法
    			$("a").html("新浪").prop("href","http://www.sina.com");
    		});
    	});
    	</script>
      </head>
      
      <body>
        <a href="http://www.baidu.com">百度</a>
        <input type="button" value="点我"/>
        <input type="text"/>
      </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，280人围观）

还没有评论，来说两句吧...

相关阅读

相关 java swing实现点击按钮切换图片（简单实现）

> 本文教程，主要提供一个简单的例子，使用java swing完成点击按钮能够切换图片。目录一、程序预览二、程序代码 --------------------

柔光的暖阳◎/ 2024年02月22日 09:41/ 0 赞/ 14 阅读

相关 vue点击按钮跳转页面

在Vue.js中，你可以使用<router-link>或this.$router.push()来实现点击按钮跳转页面的功能，前提是你已经配置了Vue Router。以下是两种不

女爷i/ 2024年02月20日 10:45/ 0 赞/ 14 阅读

相关点击链接/按钮下载图片的实现方法

点击链接/按钮下载图片的实现方法需求场景 JSP代码 JS代码需求场景需要根据已给的链接，根据链接生成一个二维码。并在页面上提供点击即可下

Love The Way You Lie/ 2022年08月31日 14:28/ 0 赞/ 266 阅读

相关 jQuery跳转链接

[jQuery][]实现网页跳转或用命令打开指定网页！ location.href = "www.baidu.com"; location.href = "test.

阳光穿透心脏的1/2处/ 2022年07月13日 08:58/ 0 赞/ 171 阅读

相关下拉框点击跳转链接地址

[下拉框点击跳转链接地址][Link 1] <select onchange="javascript: window.open(this.options[t

柔光的暖阳◎/ 2022年04月24日 05:12/ 0 赞/ 240 阅读

相关 JS 实现点击按钮实现超链接功能

url = '/webroot/decision/view/report?viewlet=InshipOutship/Outship.frm'; 新窗口打开报表：window

我就是我/ 2022年01月10日 11:07/ 0 赞/ 1633 阅读

相关原生js点击按钮切换图片

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>动态切换图片</

谁借莪１个温暖的怀抱￠/ 2022年01月05日 11:27/ 0 赞/ 383 阅读

相关 jQuery如何通过点击按钮实现图片的切换，和超链接地址的跳转？

点击一张图片更换为另一张图片：  <script type="text/javascript" src="

我会带着你远行/ 2021年12月11日 09:41/ 0 赞/ 281 阅读

相关多图点击跳转超链接

思路-为了让图片能够跳转,这里使用超链接把图片包围住 html标签部分 ![Image 1][] 我是第一张图片 ![Image 1][] 我是第二张图片 ![I

ゝ一纸荒年。/ 2021年10月23日 09:55/ 0 赞/ 308 阅读

相关【html】点击图片内链接进行跳转

博主因为工作中遇到，有些UI图片里有多个链接，要求用户可以点击图片内相关的链接进行跳转。比如：以下是一张图片（非页面），但是要求点击图片不同位置，跳转到不同网址： !

╰+攻爆jí腚メ/ 2021年09月24日 07:28/ 0 赞/ 418 阅读