HTML怎么设置点击一张图片换一张图片

发布网友发布时间：2022-04-23 03:29

共4个回答

懂视网时间：2022-05-13 15:20

<!DOCTYPE html> 
<html> 
<body> 

<img id="image" src="/i/eg_tulip.jpg" onclick="click()"/> 

<script> 
function click(){ 

document.getElementById("image").src="/i/shanghai_lupu_bridge.jpg"; 
} 
</scrip> 


</body> 
</html>

回复讨论(解决方案)

click() 把名字换下就ok了

</scrip> 写错了。。。。</script> 否则是不执行的

其实 onclick = "this.src='/i/shanghai_lupu_bridge.jpg'";

热心网友时间：2022-05-13 12:28

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。

2、在index.html中的<script>标签，输入js代码：

function fun() {

var a = Math.random() * 5;

$('img').attr('src', 'image' + a + '.jpg');

}

3、浏览器运行index.html页面，此时点击图片会换一张图片。

热心网友时间：2022-05-13 13:46

html：

默认显示的图片为banner02.jpg；下面用jq的click事件来触发更换图片。其jq代码如下：

$("span").click(function(){
var src = "picture/banner03.jpg"; //新图片地址
$(this).find("img").attr("src",src); //更换图片地址
});

热心网友时间：2022-05-13 15:21

设置图片的点击事件，在点击事件中修改图片的src属性