php - 下拉列表在 chrome 中带有滚动条

Question

在 chrome 中，某些情况下下拉列表元素带有滚动条，我想在下拉单击时显示所有没有滚动条的元素，在我的情况下，所有元素都在下拉列表中可用，但只有一个显示并且需要滚动去看别人。

代码如下。

<div class="controls">
                            <select name="teamId" id="teamIdSel" class="span2" >
                                 <?php foreach ($team_list as $team): ?>
                                    <option class="teamSelOpt" diviID="<?php echo $team->division_id; ?>" value="<?php echo $team->team_id; ?>" <?php if ($team->team_id == $teamId) { ?> selected <?php } ?> ><?php echo $team->name; ?></option>
                                <?php endforeach; ?>    
                            </select>
                        </div>

<input type="button" onclick="onChangeDivision('10', null, null)"/>

这里我在 javascript 中使用“diviID”动态显示和隐藏选项。

javascript 函数如下。

 function onChangeDivision(id, teamId, clientUserID){
    if(id){
        $('.teamSelOpt').each(function() {
            var diviId = $(this).attr("diviID");
            if(diviId == id){
                $(this).show();
            }else{
                $(this).hide();
            }
        });
}
}

当我删除“$(this).hide();”时来自函数的代码它可以正常工作。但结果将违反我的要求。

Answer 1

您将不得不改用列表并在悬停/点击时显示它，就像 Google 在 Google plus 中所做的那样。您不能隐藏下拉菜单的滚动条。