使用 Javascript/jQuery 打开选择？

IT技术 javascript jquery jquery-events
2021-03-07 20:27:41

有没有办法使用Javascript（和jQuery）打开选择框？

<select style="width:150px;">
    <option value="1">1</option>
    <option value="2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc arcu nunc, rhoncus ac dignissim at, rhoncus ac tellus.</option>
    <option value="3">3</option>
</select>

我必须打开我的选择，这是 IE 错误的原因。所有版本的 IE (6,7,8) 都削减了我的选择。据我所知，没有针对此的 CSS 错误修复。目前我尝试执行以下操作：

var original_width = 0;
var selected_val = false;

if (jQuery.browser.msie) {
    $('select').click(function(){
        if (selected_val == false){
            if(original_width == 0)
                original_width = $(this).width();

            $(this).css({
                'position' : 'absolute',
                'width' : 'auto'
            });
        }else{
            $(this).css({
                'position' : 'relative',
                'width' : original_width
            });
            selected_val = false;
        }
    });

    $('select').blur(function(){
        $(this).css({
            'position' : 'relative',
            'width' : original_width
        });
    });

    $('select').blur(function(){
        $(this).css({
            'position' : 'relative',
            'width' : original_width
        });
    });
            
    $('select').change(function(){
        $(this).css({
            'position' : 'relative',
            'width' : original_width
        });
    });

    $('select option').click(function(){
        $(this).css({
            'position' : 'relative',
            'width' : original_width
        });
    
        selected_val = true;
    });

}

但是第一次点击我的选择会改变选择的宽度，但我必须再次点击才能打开它。

6个回答

我知道这很旧并且得到了回答，但这在 Safari 和 iOS UIWebView 中对我有用 - 我隐藏了它，但希望它在单击不同的按钮时显示和打开。

$('#select-id').show().focus().click();
谢谢！经过 6 小时的反复试验，这在堆栈 JQM/Cordova/FastClick 上成功了！！！
2021-04-29 20:27:41
On Chrome, when the select box is the target of the keydown event, this works like a charm! 感谢您的提示，马特 H
2021-05-16 20:27:41

click您可以使用mousedown处理程序来捕获mousedown事件，而不是使用。 mousedown之前触发click，因此您可以调用stopPropogation中断事件队列。

试试这个： 

var myDropDown=$("#myDropDown");
var length = $('#myDropDown> option').length;
//open dropdown
myDropDown.attr('size',length);

这要关闭：

//close dropdown
myDropDown.attr('size',0);

试试这个：

dropDown = function (elementId) {
    var dropdown = document.getElementById(elementId);
    try {
        showDropdown(dropdown);
    } catch(e) {

    }
    return false;
};

showDropdown = function (element) {
    var event;
    event = document.createEvent('MouseEvents');
    event.initMouseEvent('mousedown', true, true, window);
    element.dispatchEvent(event);
};

然后调用函数：

dropDown('elementId');
jQuery 触发器不起作用。您应该尝试创建类似答案的事件。
2021-05-06 20:27:41
如果您使用 JQuery，您也可以使用 trigger() 命令。
2021-05-14 20:27:41

没有jQuery 解决方案。

<SCRIPT>
    function toggleDropdown(element){
        if(element.size == 0) {
            element.size = element.length;
            element.focus();
            }
        else element.size = 0;
        }
</SCRIPT>

在这里找到了这个。

这将打开下拉列表，但不允许在列表中进行后续的箭头键导航。
2021-04-25 20:27:41
其它你可能感兴趣的问题
上一篇setInterval 会导致浏览器挂起吗？ 下一篇ES6 中函数后面的模板文字（反引号）的目的是什么？