Javascript 选项select可动态更改下一个选择

我用的是一个叫做羽毛灯的灯箱。我在灯箱中有一个表单，它需要一个动态选择选项来更改下一个问题选择框的内容

选择框在灯箱外部工作，但在灯箱内部失败

你知道我哪里出了问题吗

<select>
  <option value="111">111</option>
  <option value="222">222</option>
</select>


<select>
  <option value="111">111</option>
  <option value="222">222</option>
</select>


<script type="text/javascript">
    $(function(){
        $('select').change(function(){ // when one changes
            $('select').val( $(this).val() ) // they all change
        })
    })
    </script>

111
222
111
222
$（函数（）{
$（'select'）.change（函数（）{//
$（'select'）.val（$（this.val（））//它们都会更改
})
})

为这两个选项都有唯一的id，请选择以下选项

<select id='select1'>
  <option value="111">111</option>
  <option value="222">222</option>
</select>


<select id='select2'>
  <option value="111">111</option>
  <option value="222">222</option>
</select>


<script type="text/javascript">
    $(function(){
        $('#select1').change(function(){ // when one changes
            $('#select2').val( $(this).val() ) // they all change
        })
    })
    </script>

---

您的HTML很可能是在绑定处理程序后添加的-您可以使用上的

。来解决此问题：

$(document).on("change", "select", function() { 
    $('select').val( this.value ) 
});

您应该将
文档
替换为页面加载时存在的容器，该容器包含您的动态内容-否则每次更改
文档
时都会触发此事件（并检查
选择
是否实际更改）

使用公共类：

<select class="common">
    <option value="111">111</option>
    <option value="222">222</option>
</select>


<select class="common">
    <option value="111">111</option>
    <option value="222">222</option>
</select>

$(document).on("change", "select.common", function() { 
    $("select.common").not(this).val( this.value ) //added .not(this) since we dont need to change the value of the select being interacted with
});


111
222
111
222
$（document）.on（“change”，“select.common”，function（）{
$（$select.common”）.not（this.val（this.value）//added.not（this），因为我们不需要更改与之交互的select的值
});
它在灯箱中做什么？呃，将select的值设置为与当前相同的值，通常不会触发任何事件，只是看起来很奇怪。jQuery有一个
trigger
方法可以触发jQuery事件处理程序，你试过了吗？@adeneo你有例子吗，我有点不确定你的意思吗？也许lightbox会用克隆或其他东西替换你的选择。@tymeJV它无法更改lightbox中的次要列表选项，所以第二个列表保持不变。在lightbox外部工作正常。恐怕还是一样，当选项在lightbox内部时，它们不会改变，它们在lightbox外部工作？在这种情况下ID不应该重要现在有一个问题，当您选择此选项时，它会影响表单中的所有其他选择框。。。因此，它将它们改变得非常好是的-您的选择器只是
select
-它针对页面上的所有
select
元素。如果你想针对少数人使用一个普通类。我试过了，但它累坏了所有人，你能帮我修改一下吗？我知道这太厚颜无耻了，但这让我发疯了：（@user3520443——用一个样本更新了答案，随着新的变化，第一个框现在列出了第二个框的所有项目。
<select class="common">
    <option value="111">111</option>
    <option value="222">222</option>
</select>


<select class="common">
    <option value="111">111</option>
    <option value="222">222</option>
</select>

$(document).on("change", "select.common", function() { 
    $("select.common").not(this).val( this.value ) //added .not(this) since we dont need to change the value of the select being interacted with
});