jquery ui dialog 中使用select2 导致select2的input失去焦点的解决方法

最新推荐文章于 2023-09-15 17:16:01 发布

转载最新推荐文章于 2023-09-15 17:16:01 发布 · 331 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/terrycy/p/6775859.html

文章标签：

#ui #javascript #ViewUI

本文介绍了解决在jQuery UI的Dialog控件中使用Select2插件时，Select2的输入搜索框无法获得焦点的问题。通过自定义Dialog控件的行为，并调整Select2的配置选项，实现了预期的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在jqueryUI 的dialog中使用select2，select2的input search无论怎样都获取不到焦点？

解决方法：

$(document).ready(function () {
        $.widget("ui.dialog", $.ui.dialog, {
            //解决Dialog控件使用select2不出现光标的问题
            open: function () {
                return this._super();
            },
            _allowInteraction: function (event) {
                return !!$(event.target).is(".select2-search__field") || this._super(event);
            }}
        );
        var user_select2_option = {
                ajax: {
                    url: "/util/account",
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            q: params.term
                        };
                    },
                    processResults: function (data, page) {
                        return {
                            results: data.items
                        };
                    },
                    cache: true
                },
                allowClear: true,
                minimumInputLength: 2
            };
        $(".user-select2").select2(user_select2_option);
        delete user_select2_option['allowClear'];

    });

转载于:https://www.cnblogs.com/terrycy/p/6775859.html