使引导下拉的行为类似于选择

时间:2016-09-27 02:01:34

标签: html css twitter-bootstrap twitter-bootstrap-3

所以现在,我的下拉列表嵌套在一些div和表中,当打开时,它会导致溢出,我似乎无法让它消失。所以我想知道是否有一种方法让下拉行为像一个选择框,因为它忽略了所有流量并且无论如何都显示在顶部。

我想使用下拉列表的主要原因是因为选择框(包括引导程序)似乎没有能力将文本框转换为图标(就像jQueryMobile如何,但我不希望使用jQueryMobile)。

以下是代码的一部分:

<table id="header_table" style="margin: 15px 0; overflow-y: visible;" class="header_background">
            <?php
            // Checkboxes
            if ($_mode == "inv")
            {
                echo "<td>"; 
                echo    "<div id='misc_header' class='resizable general header' style='min-width: 100px'>";
                echo        "<center>Misc</center>";
                echo    "</div>";
                echo "</td>";
            }

            foreach ( $_field_names[$_mode] as $key => $value ) 
            {
                echo "<td style='overflow-y: visible;'>";
                echo    "<div id='{$key}_header' class='resizable general header' style='min-width: 100px; overflow: visible;'>";
                echo        "<center>$value</center>";
                if (!preg_match("/dgclass|risk|msds|locations|hazard_codes/", $key))
                {
            ?>
                <div class="dropdown">
                  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    <span class="glyphicon glyphicon-th-list"></span>
                  </button>
                  <ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
                    <li><a href="#">Action</a></li>
                    <li><a href="#">Another action</a></li>
                    <li><a href="#">Something else here</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#">Separated link</a></li>
                  </ul>
                </div>          
                <select>
                    <option>hello</option>
                    <option>there</option>
                </select>

            <?php                   
                }
                echo    "</div>";
                echo "</td>";
            }

            //Actions
            if ($_mode == "inv")
            {
                echo "<td>";
                echo    "<div id='action_header' class='resizable general header' style='min-width: 100px'>";
                echo        "<center>Action</center>";
                echo    "</div>";
                echo "</td>";               
            }
            ?>
            <td id="scrollbar_td" style="display: none"></td>
        </table>

0 个答案:

没有答案