【问题标题】:why does my second dropdown is copying the change action of my first dropdown为什么我的第二个下拉菜单是复制我的第一个下拉菜单的更改操作
【发布时间】:2018-12-12 11:51:26
【问题描述】:

我有这 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');
        }
      });
});

【问题讨论】:

  • 您忽略了将处理函数中选定选项的选择限制为任何特定元素,所以……

标签: jquery select laravel-4 onchange


【解决方案1】:

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

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

【讨论】:

    猜你喜欢
    • 2012-06-29
    • 2021-07-06
    • 1970-01-01
    • 1970-01-01
    • 2017-09-19
    • 1970-01-01
    • 2019-02-14
    • 1970-01-01
    • 2014-08-08
    相关资源
    最近更新 更多