Question

当我从列表中进行多项选择时（请参阅下面的小提琴），如何按照最新选择的顺序显示结果（div）？例如，如果我在坚果，肉类，蔬菜，水果的顺序中多次选择，我如何得到结果（div）出现在水果，蔬菜，肉类，坚果的顺序？目前，它们按照框中列出的顺序出现。

https://jsfiddle.net/djj2c84t/

jQuery.fn.filterByText = function(mytextbox) {
  return this.each(function() {
    var select = this;
    var options = [];
    $(mydropdown).find('option').each(function() {
      options.push({
        value: $(this).val(),
        text: $(this).text()
      });
    });
    $(mydropdown).data('options', options);
    $(mytextbox).bind('change keyup', function() {
      var options = $(mydropdown).empty().data('options');
      var search = $.trim($(this).val().replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"));
      var regex = new RegExp(search, "gi");

      $.each(options, function(i) {
        var option = options[i];
        if (option.text.match(regex) !== null) {
          $(mydropdown).append(
            $('<option>').text(option.text).val(option.value)
          );
        }
      });

    });
  });
};

$(function() {
  $('#mydropdown').filterByText($('#mytextbox'), true);
});

$(document).ready(function() {
  function exists(elemt, arr) {
    return (jQuery.inArray(elemt, arr) > -1);
  }

  $('#mydropdown').change(function() {
    var $selected = $(this).val();
    $('.mydivs1').each(function() {
      $(this).toggle()[
        (exists($(this).attr('match'), $selected)) ? 'show' : 'hide']();
    });
  });
});

我已经尝试了四个月来在网上搜索答案，但是，我发现的几乎所有建议都与“获取”或“接收”结果相关，而不是仅仅显示或使用一个我不想做的插件（Select2，Chosen等）。

我一直在网上学习示例并进行自己的更改，因为我在Javascript，JQuery和CSS方面的知识非常有限，所以如果有人可以提供任何帮助，可能会提供任何示例代码，我们将非常感激。以及代码需要去的地方。

还有其他一些我无法解决的问题，但我不会一次发布太多问题，而是会单独发布。

谢谢。

Answer 1

我希望我能理解你的问题。

我做了这个小提琴，例如：

修改

Fiddle Example

最好使用：

$('option').click(function () {});

而不是

$('#mydropdown').change(function() {});

我所做的就是在＆＃34; MainDiv ＆＃34;中重绘想要的div。我添加了

如何按照最新选择的顺序显示多个选择结果/ div？

1 个答案: