我需要一个下拉菜单,这个下拉菜单将是一个数值,我只想根据这个值显示一定数量的图像。
有人能帮忙吗。
<div>
<select id="selectLevel" style="width:8%" onChange="changeOPLevel()">
<option value="1" selected=""> Level 1</option>
<option value="2"> Level 2</option>
<option value="3"> Level 3</option>
<option value="4"> Level 4</option>
<option value="5"> Level 5</option>
<option value="6"> Level 6</option>
</select>
</div>
图像为
<img src="buildings/lvl 4.png">
现在,场景将是,如果选择级别5,则将有14张图片(都是同一张图片),如果选择了级别6,则有16张图片。如果有人能在这两方面提供帮助,我将能够修改它来做我需要的一切。
提前感谢
wayne
如果我正确理解您的问题,您有16个图像,并且您希望根据所选级别L显示其中的数字N,其中N=2L+4。
您可以使用几行jQuery:来完成此操作
var n = $('#selectLevel').val()*2+4;
$('img').show().eq(n-1).nextAll().hide();
第一行确定要显示的图像数。
第二行做五件事:
$('img')
:选择页面上的所有图像作为集合.show()
:这显示了所有这些图像.eq(n-1)
:这获取第n个图像。(在JavaScript中,集合是从零开始的,所以我们必须从n
中减去1。).nextAll()
:这将选择在步骤3中找到的图像的所有以下同级.hide()
:这将隐藏在步骤4中选择的所有同级
Fiddle:http://jsfiddle.net/v44LwLhr/1/