Question

已经创建了插件来向ckeditor添加令牌，例如样式下拉列表，但它们不像普通的HTML选择框那样可搜索。是否有启用它的选项？

提前致谢。

Answer 1

我无法找到配置选项，但我找到了解决方法。

在ckeditor rich combo init函数中添加一个文本输入作为第一项，你自己处理

this.add('search', '<div onmouseover="parent.comboSearch(this);" onclick="parent.nemsComboSearch(this);"><input class="cke_search" placeholder="Search"/></div>', '');

比你需要的

       if(!jQuery.expr[':'].icontains){
             jQuery.expr[':'].icontains = function(a, i, m) {
                return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
            };
        }

        window.comboSearch= function(element) {

            var anchorID = $(element).closest('a').attr("id");
            var liDom = $(element).closest('li');

            liDom.empty().append('<div id="' + anchorID + '" style="padding:4px 5px;"><input class="cke_search" placeholder="Search" /></div>');

            liDom.find('input').off("keyup").on("keyup", function() { 
                var data = this.value;
                //create a jquery object of the rows
                var jo = liDom.siblings('li');

                filter.call(this, data, jo);

            }).focus(function() {
                this.value = "";
                $(this).unbind('focus');
            });
        };

        function filter(data, jo) {
            if (this.value === "") {
                jo.show();
                return;
            }
            //hide all the rows
            jo.hide();

            //Recusively filter the jquery object to get results.
            jo.filter(function(i, v) {
                var $t = $(this);
                if ($t.is(":icontains('" + data + "')")) {
                    return true;
                }
                return false;
            }).show();
        }

注意我在我的例子中使用jquery。我知道这是一个讨厌的解决方法，但我找不到更好的解决方案，这在这里工作。见下面的截图

希望这会有所帮助 See this link

我们如何使ckeditor丰富的组合可以像普通的html选择框一样搜索。

1 个答案: