如何打开编程选择 [英] How to open select programmatically

查看:174
本文介绍了如何打开编程选择的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有谁知道是否有可能在angularjs编程方式打开一个选择。香港专业教育学院试图

Does anyone know if it is possible to open a select programmatically in angularjs. Ive tried

angular.element(el).trigger('focus');
angular.element(el).trigger('click');
angular.element(el).trigger('mousedown');

没有什么工作。

我也试过

$scope.doSomething = function(){
    setTimeout(function() {
        var el = document.getElementById('test');
        var e = document.createEvent("MouseEvents");
        e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        worked = el.dispatchEvent(e);
    }, 0);

}

以上组焦点,但不要打开选择。

The above set focus but do not open the select.

这可能吗?

推荐答案

我有同样的问题,最后我正在创建自己的指令:

i had same problem and finally i'm create my own directive:

angular.module('openselect', [])
    .directive('openselect', function () {
        var showDropdown = function (element) {
            var event;
            event = document.createEvent('MouseEvents');
            event.initMouseEvent('mousedown', true, true, window);
            element.dispatchEvent(event);
        };
        return {
            restrict: 'A',
            scope: {
                'elemento': '@'
            },
            link: function (scope, elem, attrs, ctrl) {
                elem.bind('click', function () {
                    var elemento = document.getElementById(scope.elemento);
                    showDropdown(elemento);
                });
            }
        };
    });

要使用:

<div style="position:relative">
<span ng-show="submittedForm.contry.$error.required && co_form.contry.$error.required" class="label label-danger">Indicanos tu país</span>
<select name="country" class="form-control input-md" ng-model="formCheckout.country" id="myCountry" placeholder="España" required>
    <option value="6" selected="selected">España</option>
    <option value="1">Alemania</option>
    <option value="15">Portugal</option>
</select>
<span class="glyphicon glyphicon-chevron-down" style="position: absolute; right: 10px; color: #A6A6A6; top: 18px;" openselect elemento="myCountry"></span>

再添指令要打开传球选择(ELEMENTO)ID任何标记。

Adds directive to any tag passing id of select (elemento) that you want to open.

您可以看到里面的指令非常基本的javscript code,如果你想在其他环境中使用;

You can see the very basic javscript code inside directive if you want to use in other context;

希望它帮助; d

这篇关于如何打开编程选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆