我有几个共享同一个类的 div。
我有一个下拉菜单,它在选中时更改其中一个 div 的背景颜色(选项 2 更改 div #2)。
我的问题是如何在单击某个 div 时更改下拉选项?
我有更改实际选项和点击 div 的逻辑,但我无法弄清楚如何准确找到点击了哪个 div(div 是动态创建的,所以它们没有 ID,只有类名) .
有什么方法可以检查相对于具有相同类别的整个 div 列表单击了什么 div?
谢谢。
示例代码:
<select class="size form-control" id="size" name="size">
<option value="1">first div</option>
<option value="2">second div</option>
<option value="4">third div..</option>
</select>
<div class="collection">random</div>
<div class="collection">text</div>
<div class="collection">inside</div>
<div class="collection">here</div>
编辑:
我有什么:
select 可以根据选择更改 div 的颜色。
点击一个 div 会改变它自己的颜色。
我需要什么:
单击 div 也会更改选择中的选项。
我希望现在更清楚一些
最佳答案
使用 jQuery 您可以使用 .index() 获取点击的 div 的索引
$('div.collection').click(function () {
var index = $('div.collection').index($(this));
console.log(index);
$('select').val(index + 1);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="collection">Div1</div>
<div class="collection">Div2</div>
<div class="collection">Div3</div>
<div class="collection">Div4</div>
<select class="size form-control" id="size" name="size">
<option value="1">first div</option>
<option value="2">second div</option>
<option value="4">third div..</option>
</select>
关于javascript - 从元素列表中找出哪个元素被点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39173495/