jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法

【技术探讨】

下载

新闻

文章

AJAX返回的html无法做到自动渲染为EasyUI的样式.比如：class="easyui-layout" 等

AJAX返回的html或者是js定义的html无法做到自动渲染为EasyUI的样式。比如：class="easyui-linkbutton" 等，虽然我们可以对应执行代码来渲染它，但前提是你得知道它是什么控件，比如：

$("body").append('<a href="javascript:void(0)" id="a" class="easyui-linkbutton">确定按钮</a>');//生成控件html
$("#a").linkbutton();//渲染

但是假如控件不确定时就不能使用以上方法，我们可以为其扩展一个方法。

(function ($) {
    $.parser = {
        auto:true,
        plugins:['linkbutton', 'menu', 'menubutton', 'splitbutton', 'layout','tree', 'window', 'dialog', 'datagrid','combobox', 'combotree', 'numberbox', 'validatebox','calendar', 'datebox', 'panel', 'tabs', 'accordion'],
        parse:function (context) {
            if ($.parser.auto) {
                for (var i = 0; i < $.parser.plugins.length; i++) {
                    (function () {
                        var name = $.parser.plugins[i];
                        var r = $('.easyui-' + name, context);
                        if (r.length) {
                            if (r[name]) {
                                r[name]();
                            } else if (window.easyloader) {
                                easyloader.load(name, function () {
                                    r[name]();
                                })
                            }
                        }
                    })();
                }
            }
        }
    };
})(jQuery);

这样当某些html增加后就可调用$.parser.parse(context)来渲染控件。context 为待查找的 DOM 元素集、文档或 jQuery 对象,为空时默认为整个文档