2016-08-05 2 views
0

Добрый день,JQuery выбран раскрывающийся получает «вырезать» при размещении внутри скроллинга

Я использую JQuery «выбрал» плагин для «выбора» в раскрывающемся списке. Проблема заключается в том, что выпадающее меню расположено в области прокрутки. В этом случае выпадающие элементы получают «вырезание» внешним элементом div. Я создал простой пример: http://jsfiddle.net/olegbevz/083z9ctL/1

<div class="dialog" style="height: 100px;"> 
    <div style="height:100px; overflow-y:auto"> 
     <select id="select" style="width: 205px;"> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
       <option>Some Value</option> 
    </select> 
    </div>  
</div> 

$("#select").chosen({ width: "200px", disable_search: false }); 
$(".dialog").dialog(); 

При попытке открыть выпадающее меню в диалоговом окне вы можете увидеть, что она порезы.

Есть ли решение этой проблемы?

Обновление: Как я уже говорил, мне нужно сделать выбор внутри прокручиваемой области, поэтому я не могу удалить атрибут «overflow-y». После тега select могут быть другие элементы управления, которые не соответствуют внешнему div, поэтому требуется полоса прокрутки. Я улучшил свой пример, чтобы сделать его более ясным, чего я хочу достичь: jsfiddle.net/olegbevz/083z9ctL/5.

ответ

0

Добавить содержащий DIV, который имеет ZIndex набор для выше верхней DIV, и снимите перепускной-у из верхнего одного

<div style="height:100px;"> 
    <div style="z-index:1000;"> 

http://jsfiddle.net/083z9ctL/2/

+0

Спасибо за ваш ответ. Но, как я уже сказал, мне нужно поместить выбор внутри области прокрутки, поэтому я не могу удалить атрибут «overflow-y». После тега select могут быть другие элементы управления, которые не соответствуют внешнему div, и поэтому требуется полоса прокрутки. Я улучшил свой пример, чтобы сделать более понятным, чего я хочу достичь: http://jsfiddle.net/olegbevz/083z9ctL/5/. –

0

На самом деле style=" overflow-y:auto;" должен быть установлен в <select> тег, вы установили его <div> теге неправильно,

Изменить <select> тег как,

<select id="stateLicenseSelect" style="width: 205px;" style=" overflow-y:auto;"> 

Обновлено Fiddle: http://jsfiddle.net/083z9ctL/3/

НТН

+0

Благодарим вас за ответ. Но, поскольку я боюсь, мне нужно поместить выбор внутри прокручиваемой области, поэтому я не могу переместить атрибут overflow-y для выбора тега. После тега select могут быть другие элементы управления, которые не соответствуют внешнему div, и поэтому требуется полоса прокрутки. Я улучшил свой пример, чтобы сделать более понятным, чего я хочу достичь: jsfiddle.net/olegbevz/083z9ctL/5. –

Смежные вопросы