SumoSelect 重新加载后无法打开答案

【问题标题】：SumoSelect won't open after reloadSumoSelect 重新加载后无法打开
【发布时间】：2018-05-08 15:43:26
【问题描述】：

我在我的网络输入中使用sumoselect。

问题是 - 如果你打开第二个 sumoselect，然后你想先打开 - 所以先点击他没有打开...

我的代码：

$('.country').SumoSelect({placeholder: 'first'});
$('.anotherSumo').SumoSelect({placeholder: 'second'});

$('.anotherSumo').on('sumo:closing', function(e) {

  $('.country').empty();
  $('.country').append('<option value="newValue">newValue</option>');
  $('.country')[0].sumo.reload({placeholder: 'first'});
});

这是工作小提琴。只需打开第二个选择，然后尝试先打开 - 2 次点击。以相反的顺序 - 第一次点击打开第一个相扑，然后第二次点击第二个相扑就一切正常...

我试图在重新加载后添加$('country').trigger("click");，但什么也没有

https://jsfiddle.net/eqa9og2v/5/

我需要知道如何在第二次点击时以任何方式打开第一个相扑，但在 sumoselect 关闭时使用功能触发器 - 因为第一个用户做出选择，如果用户完成选择选项，他会关闭 sumoselect（打开另一个或仅关闭）

【问题讨论】：

将sumo:closing 更改为sumo:opening 可以解决问题。那么sumo:opening有什么问题吗？根据你的代码，我不这么认为。
sumo:opening 对我来说是个问题，因为用户必须首先选择选项，然后相扑关闭，然后我更改值...

标签： javascript jquery plugins multi-select sumoselect.js

【解决方案1】：

我认为您尝试实施的方式是不可行的，也无法实现，因为当您单击第一个打开它时，会调用第二个下拉关闭，您可以在其中重新创建第一个。因此，当所有新绑定都添加到第一个下拉菜单中时，第一个下拉菜单的实际点击就会丢失。

如果你想实现它，你必须更改插件中的代码，这不是一个好习惯。您也可以使用$('.sumo_country').addClass('open').attr('aria-expanded', 'true'); 强制第一个下拉菜单显示选项，但再次关闭下拉菜单，您必须第一次单击两次。

更改任何依赖于其他下拉值的正确且可行的方法是使用下拉列表的change 函数。

在您的情况下，无论何时从第二个下拉列表中选择或取消选择该值，您都必须更改数据，这对您有用。

【讨论】：

【解决方案2】：

这是工作示例。正如您在 cmets 中提到的，您希望在从第二个中选择某些内容后更改第一个选择，而不仅仅是在关闭它之后。 .on('change', ...) 似乎可以解决问题。

https://jsfiddle.net/eqa9og2v/6/

【讨论】：

它不工作......是的，点击后相扑打开但没有任何变化......没有'newValue'......你的代码结果就像只有init两个相扑选择没有更多......
好的，抱歉，我认为您的要求对我来说没有意义。如果用户没有在 sumo2 中选择任何内容，为什么要更改 sumo1 的内容？我认为内容应该根据选择而改变，这个解决方案符合需要。
我很快就会看到你的问题，所以我看不出你的回答是个好主意，但在我的情况下很遗憾无法使用，因为在网络上有 3 个选择选项 - 国家、地区和地点，它们已连接，因此用户触发的.on('change') 事件触发了我的代码，所有输入选项都发生了变化...

【解决方案3】：

所以我想通了...有办法做到这一点！我正是需要这个 - 如果你有一些通知或任何你欢迎的东西。

我的代码：

$('.country').SumoSelect({placeholder: 'first'});
$('.anotherSumo').SumoSelect({placeholder: 'second'});

$('.anotherSumo').on('sumo:closed', function(e) { 

    var count = $('.country option').length;

    for(var i = 0; i < count; i++) {
        $('.country')[0].sumo.remove(0);    
    }

    $('.country')[0].sumo.add('newValue','newValue', 0);
});

工作小提琴： https://jsfiddle.net/eqa9og2v/7/

注意：如果您需要正常工作的输入（用于发送表单或其他内容），您也需要通过自己的方式添加/删除 select 中的 option 元素......

【讨论】：