Question

所以，我在这里尝试做的就是点击游戏。我希望可以从下拉列表中选择敌人，然后您可以单击您选择添加到资源中的任何敌人（其中有四个用于此游戏）。但是，当我使用此代码时，可点击的图像不会显示出来。有没有更有效的方法来做到这一点？这是我正在处理的部分中的HTML和Javascript（其他部分已经过测试，可以看到它们正常工作）。它所引用的图像位于同一个文件夹中，并且已经编写了onclick功能，并使用非下拉列表图像进行测试并进行了处理。下拉列表适用于不可点击的图像。当我把它们放在一起时，它们似乎无法工作。

＆＃13;

function changeE(){
	var dropdownList = document.getElementById('changeEid');
	var selectedIndex = dropdownList.selectedIndex;
	var selectedValue = dropdownList.options[selectedIndex].value;
	
	var enemyDiv = document.getElementById('enemyHere');
	switch(selectedValue){
		case 'DestroyerPrincess':
			enemydiv.innerHTML = '<img src="B1-DestroyerPrincess.png" width="445px" height="590px" onclick="fuelClick(1);ammoClick(1); steelClick(1); bauxiteClick(1)">';
			break;
		case 'LightCruiserDemon':
			enemydiv.innerHTML = '<img src="B2-LightCruiserDemon.png" width="424px" height="616px" onclick="fuelClick(1);ammoClick(1); steelClick(1); bauxiteClick(1)">';
			break;
			}
	};

＆＃13;

	Enemy
	<select id="changeEid" onclick="javascript:changeE();">
		<option value="DestroyerPrincess">Destroyer Princess</option>
		<option value="LightCruiserDemon">Light Cruiser Demon</option>
		</select>
	<div id="enemyHere">
	</div>

＆＃13;

Answer 1

这只是一个错字。在JavaScript部分代码中，将enemydiv.innerHTML替换为enemyDiv.innerHTML

function changeE(){
    var dropdownList = document.getElementById('changeEid');
    var selectedIndex = dropdownList.selectedIndex;
    var selectedValue = dropdownList.options[selectedIndex].value;

    var enemyDiv = document.getElementById('enemyHere');
    switch(selectedValue){
        case 'DestroyerPrincess':
            enemyDiv.innerHTML = '<img src="B1-DestroyerPrincess.png" width="445px" height="590px" onclick="fuelClick(1);ammoClick(1); steelClick(1); bauxiteClick(1)">';
            break;
        case 'LightCruiserDemon':
            enemyDiv.innerHTML = '<img src="B2-LightCruiserDemon.png" width="424px" height="616px" onclick="fuelClick(1);ammoClick(1); steelClick(1); bauxiteClick(1)">';
            break;
            }
    };

Answer 2

我建议您使用onchange事件而不是onclick：

<select id="changeEid" onchange="javascript:changeE();">
        <option value="DestroyerPrincess">Destroyer Princess</option>
        <option value="LightCruiserDemon">Light Cruiser Demon</option>
</select>

使用select标签我总是使用onchange它更好，因为你只想在用户选择有意义的东西时进行更改，我希望这有帮助

可点击的下拉列表图像

2 个答案: