嗨，我是javascript新手
我正在尝试根据用户从选择输入中选择的内容更改图像。
我想链接用户从select中选择的内容和数组
我也希望它是javascript而不是jquery
这是我到目前为止所管理的，但我坚持为什么它告诉我未定义
<html>
<body>
<style>
.cta {
padding: 10px 20px;
background-color: red;
color: #ffffff;
display: block;
width: 180px;
text-align: center;
}
</style>
<div>
<label for="fullname">First name:</label>
<input name="fullname" class="sig_fullName" type="text" placeholder="Full name">
<br>
<label>Job title</label>
<input class="sig_jobTitle" type="text" placeholder="Last name">
<br>
<label>phone number</label>
<input class="sig_mobile" type="text" placeholder="Mobile">
<br>
<label for="company">Company:</label>
<select name="company" class="sig_company">
<option value="">please select</option>
<option value="">company1</option>
<option value="">company2</option>
<option value="">company3</option>
</select>
</div>
<a class="cta" onclick="generate();">Generate</a>
<div>first name: <span class="name"></span></div>
<div>Job title: <span class="job"></span></div>
<div>Phone number: <span class="number"></span></div>
<img class="companylogo" src="./img/example.jpg">
<script>
function generate() {
var fullName = document.querySelector(".sig_fullName").value;
var jobTitle = document.querySelector(".sig_jobTitle").value;
var Mobile = document.querySelector(".sig_mobile").value;
document.querySelector(".name").innerHTML = fullName;
document.querySelector(".job").innerHTML = jobTitle;
document.querySelector(".number").innerHTML = Mobile;
var swap = [
'./img/company1.svg',
'./img/company2.svg',
'./img/company3.png',
]
var logo = document.querySelector(".companylogo");
var dropdown = document.querySelector(".sig_company");
logo.src = swap.value;
}
</script>
</body>
</html>
我认为问题在于您访问swap数组内的属性的方式
试
logo.src = swap[dropdown.selectedIndex - 1];
下拉列表将有一个selectedIndex值，它像数组一样基于0，但是因为第一个值是"请选择"。我们需要从selectedIndex中减去1，以正确地将其与图像数组对齐。