Question

我有这2个下拉菜单，它们在onchange中具有相同的功能，如果我选择“进行快速付款”，它应该能够显示一种快速付款方式，但是问题是第二个下拉菜单只是复制了第一个下拉菜单的操作

<div class="sample" data-key="1001">
    <form class="form" id="form-1001">
    <select class="form-control">                                                                                                                                
        <option value="1">1</option>
        <option value="2">2</option>                                                                                                                                            
        <option value="express">Make Express Payment</option>
    </select>
    </form>
</div>
<div class="sample" data-key="1002">
    <form class="form" id="form-1002">
    <select class="form-control">                                                                                                                                
        <option value="1">1</option>
        <option value="2">2</option>                                                                                                                                            
        <option value="express">Make Express Payment</option>
    </select>
    </form>
</div>

例如

第一个drpdwn = 1
第二个drpdwn =快速按钮

该场景将是第二个下拉列表，但不会显示模式，但是

第一个drpdwn =制作快速按钮（将显示模式）
第二个drpdwn = 1

结果将是第二个下拉菜单，还将显示应该不显示的模式。

这是jquery代码$(this).data('key')是1002或1003。

$( ".sample" ).each(function() {
    alert($(this).data('key'));
    $( "#form-"+$(this).data('key')).change(function() {
        if ($("option:selected"). val() === "express") {
            $('#express-payment-modal').modal('show');
        }
      });
});

Answer 1

您正在change函数中使用通用jQuery选择器-$("option:selected")将为您提供数组中的两个元素。当有val（）调用时，它将为您提供数组中第1个元素的值。试试这个-

`$( "#form-"+$(this).data('key')).change(function(e) {
    if (e.target.value === "express") {
     //...
    }
 });

为什么我的第二个下拉菜单会复制我的第一个下拉菜单的更改操作

1 个答案: