gpt4 book ai didi

进行下拉选择时,JavaScript 代码无法显示图片

转载 作者:行者123 更新时间:2023-11-28 14:02:18 25 4
gpt4 key购买 nike

我正在尝试运行一个代码,其中一旦通过下拉菜单选择了一个选项,就会出现一张图片。不确定但是,只有第一张图片出现(应该只是因为我选择了它开始)但此后没有任何变化。看起来我的 JS 根本不起作用。很抱歉发布基本类型,我是 Javascript/HTML 的新手。附上代码。

尝试将 javascript 分开并调用它但没有成功。

var pictureList = [
"http://lorempixel.com/400/200/sports/1",
"http://lorempixel.com/400/200/sports/2",
"http://lorempixel.com/400/200/sports/3",
"http://lorempixel.com/400/200/sports/4",
"http://lorempixel.com/400/200/sports/5", ];
$('#picDD').change(function () {
var val = parseInt($('#picDD').val());
$('img').attr("src",pictureList[val]);
});
    img {
width:400px;
margin:auto;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
</head>

<body>
<img src="http://lorempixel.com/400/200/sports/1" />
<select id="picDD">
<option value="1" selected>Picture 1</option>
<option value="2">Picture 2</option>
<option value="3">Picture 3</option>
<option value="4">Picture 4</option>
<option value="5">Picture 5</option>
</select>

</body>
</html>

最佳答案

您应该使用 jquery 库来运行您的代码。将此脚本添加到您的 HTML 代码中:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

如果你不使用这个库,你的选择将不起作用。

关于进行下拉选择时,JavaScript 代码无法显示图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57568046/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com