Question

我有一个页面，其中有许多select s显示了大量选项（想想75 select s，每个有200个选项）。我意识到这是丑陋/糟糕的想法/等等。为了让事情变得更加活泼，我在每个选择中默认只包含一个option，然后在click事件中添加其余内容。这样可以正常工作，但当select显示其下拉列表只有一个option时，会有一秒钟的时间，然后会在一瞬间显示其余部分。

有没有办法暂停＆＃34;显示自己的下拉，直到我添加了其他选项后？

如果有帮助，这是代码：

$(document).on('click', 'select', function(){
  var thisJQ = $(this);
  if (thisJQ.children().length > 1) {
    return;
  }

  var values = otherOptions ; // defined elsewhere

  var optSelected = thisJQ.children('option:selected');
  var opts = [];
  values.forEach(function(obj, index){
    if (parseInt(optSelected.val(), 10) === obj["id"]) {
      return;
    }

    var opt = document.createElement('option');
    opt.appendChild(document.createTextNode(obj["desc"]));
    opt.setAttribute('value', obj["id"]);
    opts.push(opt);
  })
  thisJQ.append(opts);
});

Answer 1

看起来阻止select删除的唯一方法是禁用它，但在我的情况下，这将是一个问题，因为禁用的输入无法接收click event。所以，我最终得到了解决方案posted here（尽管此问题还有一些其他答案也很有趣）。它为每个div增加了两个select s，它需要再点击一次，但效果很干净。

如何防止选择暂时显示下拉？

1 个答案: