个人中心
gpt4 book ai didi

javascript - 在更改时在两个下拉菜单之间传递值。无需点击即可更新

转载 作者：行者123 更新时间：2023-11-28 04:28:58 25 4
gpt4 key购买 nike

我正在尝试构建 2 个具有相同选项值(相同文本)的独立下拉选择器

选择器 1选择器2

<script type="text/javascript">


jQuery(function ($) {
var $set = $('#selector1, #selector2')
$set.change(function () {
    $set.not(this).val(this.value)
})

})
</script>

<html> 
 <div style="float: right;margin-left: 10px;">
                    <div >
                    <select id="selector1" onchange="" 
 style="width:130px;">
                      <option selected diabled hidden value="">Select Volume 
 Type</option>
                        <option value="1">Auto-Weekly</option>
                        <option value="2">Auto-Monthly</option>
                        <option value="3">Custom Weekly</option>
                              <option value="4">Custom Monthly</option>

                    </select></div>
                </div>
<td style="text-align: center;">

<select id="selector2" style="width:80px;">
<option selected="" diabled="" hidden="" value="0">Select Report 
Period</option>
                        <option value="1">Auto-Weekly</option>
                        <option value="2">Auto-Monthly</option>     
                            <option value="3">Custom Weekly</option>   
                             <option value="4">Custom Monthly</option>        
                    </select>

                            </td>


</html>

问题:现在我已经使用上面的 javascript 来匹配 $set 中的值。问题是我必须“单击”下拉列表才能“更新”。例如，如果我在选择器1中选择了选项值=1，那么我必须“单击”选择器2才能查看更新的值。

请问有更完善的解决方案吗？我稍后会以不同的方式使用这些选项，这就是为什么我需要 2 个单独的选择器并通过绑定(bind)来匹配它们。

最佳答案

我已经尝试过以下脚本，但它仍然需要我单击以更新下拉值。 

<script type="text/javascript">
$(document).ready(function(){
$('#selector1, #selector2').on('change',function() 
{   
 var report_answer = jQuery('#selector1').val();
 var report_type = jQuery('#selector2').val();  



var x=  document.getElementById("selector1").selectedIndex;
var y = document.getElementById("selector2").selectedIndex;

    report_type = this.report_answer;
    this.selectedIndex = y;
        y=report_type;
    return report_type;

});
});

关于javascript - 在更改时在两个下拉菜单之间传递值。无需点击即可更新，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44783825/

25 4 0
文章推荐： c++ - QMovie webp帧断断续续
文章推荐： 第一页加载时或重新加载一定次数后的 JavaScript，无法用 "clear caches"重现
文章推荐： javascript - 找不到模块 "."- webpack
文章推荐： javascript - AngularJS网页版工作移动文本区域无法编辑