jquery – 如何更改select2框高度

我喜欢从https://github.com/ivaynberg/select2的select2框
我使用格式:选项来格式化每个元素,它看起来不错。

一切都很好,除非所选元素大于由于图像的选择框的高度。

我知道如何改变宽度,但如何改变高度,以便在选择元素后,它显示完整的东西(约150px)

这是我的开始:

<script>
 $("#selboxChild").select2({
                      matcher: function(term, text) { 
                          var t = (js_child_sponsors[text] ? js_child_sponsors[text] : text); 
                          return t.toUpperCase().indexOf(term.toUpperCase()) >= 0; 
                      },
                      formatResult: formatChild,
                      formatSelection: formatChild,
                      escapeMarkup: function(m) { return m; }
                  });
</script>

这里是我的选择框

       <select id="selboxChild" style="width: 300px; height: 200px">
       <option value="">No child attached</option>       
       </select>  

澄清:我不想让每个选项的高度改变
我在寻找选择框,以在您选择一个孩子后更改高度。

所以当页面第一次加载它说“没有孩子选择”
当你点击下拉菜单并选择一个孩子,你会看到孩子的形象。
现在我需要选择框来展开!否则,儿童的图片被切断。

有人明白吗?

你可以做一些简单的css。
从我读到的,你想设置元素的高度与类“select2-choices”。

.select2-choices {
  min-height: 150px;
  max-height: 150px;
  overflow-y: auto;
}

这应该给你设置的高度150px,它会滚动,如果需要。只需调整高度,直到您的图像适合所需。

您还可以使用css设置select2-results(选择控件的下拉部分)的高度。

ul.select2-results {
 max-height: 200px;
}

200px是默认高度,因此更改它的下拉所需的高度。

http://stackoverflow.com/questions/14824676/how-do-i-change-select2-box-height

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:jquery – 如何更改select2框高度