0

我正在尝试将 CKeditor 用作 CMS 的一部分，但我对 JavaScript 并不“那么”好，并且那里的文档没有多大帮助。

有人可能会向我展示如何更改链接插件对话框，以便它显示值的下拉列表并从中构建一个 URL，相当令人困惑，但我不明白那里的对话框系统是如何工作的，我已经缩小了范围，我知道我将需要使用，_sources/plugins/link/dialogs/link.js但至于在使用它时我是如何迷失的，我只是无法理解。

有人可以向我展示我需要向对话框添加下拉菜单（选择）的代码，该对话框具有然后将值写入 url 字段 EG 的选项

我的服务器系统有 URL /content/getLinks/，这将像这样返回 CMS 页面，

[
 {"page_name":"Contact Us","url":"Contact_Us","page_id":"1"},
 {"page_name":"Welcome to Doxie Promotions","url":"Welcome_to_Doxie_Promotions","page_id":"2"},
 {"page_name":"Bands","url":"Bands","page_id":"3"},
 {"page_name":"Upcoming Events","url":"Upcoming_Events","page_id":"4"},
 {"page_name":"About","url":"About","page_id":"7"},
 {"page_name":"Lost Efftect","url":"Lost_Efftect","page_id":"10"}
]

现在从这些数据中我想建立一个这样的选择框

<select>
    <option value="Contact_Us:1">Contact Us</option>
    <option value="Welcome_to_Doxie_Promotions:1">Welcome to Doxie Promotions</option>
    <option value="Bands:1">Bands</option>
    <option value="Upcoming_Events:1">Upcoming Events</option>
    <option value="About:1">About</option>
    <option value="Lost_Efftect:1">Lost Efftect</option>
</select>

然后，选择一个时，我希望要更改的URL字段，例如，如果第一个是选项选择的URL将是

/content/load/pid/1/url/Contact_Us

我知道我需要将插件对话框的源版本复制到已挖掘的标准版本之上

更新我到目前为止 使用_sources/plugins/link/dialogs/link.js和覆盖的尝试plugins/link/dialogs/link.js

我已经建立了这段代码

在第 429 行进入文件

,
{
    type : 'select',
    id : 'cms_links',
    label : 'CMS Page',
    items:[],
    onLoad : function(){
        (function($){
            $.ajax({
              url: "/content/getLinks/",
              dataType: 'json',
              data: "",
              success: function(data){
                $.each(data, function(key, val){
                    $("#cms_links").append(
                        "<option value='"+val.url+":"+val.page_id+"'>"+val.page_name+"</option>"
                    );
                });
              }
            });
        })(jQuery);
    }
},

但是甚至没有为我添加的代码绘制一个选择框，所以我仍然不知所措

4

3 回答 3

2

为此，您必须在路径中的 _sources 中将代码的最小化版本_sources/plugins/link/dialogs/link.js复制到最小化代码的顶部，plugins/link/dialogs/link.js我在第 429 行附近添加了下面的代码

,
{
    type : 'select',
    id : 'cms_links',
    label : 'CMS Page',
    class : 'cms_links',
    items:[],
    onLoad : function(){
        (function($){
            var cms_pageSelectElement;
            var protocolSelectElement;
            var urlSelectElement;
            $.ajax({
              url: "/content/getLinks/",
              dataType: 'json',
              success: function(data){
                  $("label").each(function(){
                    var value = $(this).html();
                    if(value == "CMS Page"){
                        cms_pageSelectElement = $(".cke_dialog_ui_input_select", $(this).parent());
                        console.log(cms_pageSelectElement);
                    }
                    if(value == "Protocol"){
                        protocolSelectElement = $(".cke_dialog_ui_input_select", $(this).parent());
                        console.log(protocolSelectElement);
                    }
                    if(value == "URL"){
                        urlSelectElement = $(".cke_dialog_ui_input_text", $(this).parent());
                        console.log(urlSelectElement);
                    }
                  });

                  $(cms_pageSelectElement).append("<option selected='selected'><none CMS link></option>");
                for(var key in data){
                    var val = data[key];
                    $(cms_pageSelectElement).append(
                        "<option value='"+val.url+":"+val.page_id+"'>"+val.page_name+"</option>"
                    );
                }
                $(cms_pageSelectElement).change(function(){
                    var val = $(this).val();
                    var parts = val.split(":");
                    var url = "content/load/pid/"+parts[1]+"/url/"+parts[0];
                    $(urlSelectElement).val(url);

                });
              }
            });
        })(jQuery);
    }
},

使用 jQuery 时，您必须稍微利用系统来更新其他元素，因为没有可以设置的值，然后设置到 HTML 元素上，因此您必须通过选择标签然后从父级获取输入来破解标签

于 2012-04-08T21:49:15.067 回答
2

你可以尝试使用这个插件：http ://cksource.com/forums/viewtopic.php?f=18&t=24282

于 2012-04-08T21:54:28.670 回答
1

我可以给你这个开始：http: //jsfiddle.net/VGWPL/

于 2012-04-08T21:10:44.823 回答