使用jquery检查以下内容的最佳方法是什么:
如果使用jquery向页面添加了多个下拉列表,请检查是否选择了相同的值
我在页面上有一个下拉列表:
<select name="brand" class="brands" onchange="some function to check for the same value>
<option>Brand 1</option>
<option>Brand 2</option>
<option>Brand 3</option>
</select>
我还可以动态添加更多下拉菜单。每个动态下拉列表都使用相同的数据作为选项。所以当我点击添加按钮以显示新的下拉列表时,我可以这样做:
<select name="brand_1" class="brands" onchange="some function to check for the same value">
<option>Brand 1</option>
<option>Brand 2</option>
<option>Brand 3</option>
</select>
再次:
<select name="brand_2" class="brands" onchange="some function to check for the same value">
<option>Brand 1</option>
<option>Brand 2</option>
<option>Brand 3</option>
</select>
等等......
我猜我可以使用类元素,也许是jquery中下拉列表的onchange()事件,但不确定这样做的最佳方法。 任何想法或帮助指出我正确的方向将非常感激。
感谢
JC
答案 0 :(得分:1)
我认为这可能是一个解决方案。 FIDDLE
但只有select
元素是一个接一个的才能起作用。
$('select').on('change', function () {
var val = $(this).val(); // get the value of the current changed select
var i = $(this).index(); // get it's index (position in the group starting from 0)
$('select:not(:eq('+i+'))').each(function () { // loop through each select
if ($(this).val() === val) { // check if the value of the next select
// is the same as the changed one
alert($(this).index()+' has the same value');
// alert the ones with the same value
}
});
});