#javascript #jquery #ajax #jsp #tinymce
#javascript #jquery #ajax #jsp #tinymce
Вопрос:
У меня есть веб-приложение, в котором я открываю некоторые всплывающие страницы во всплывающем окне colorbox (http://jacklmoore.com/colorbox /)
В одном из этих всплывающих окон мне нужно загрузить страницу с моей установкой TinyMCE, и мне удалось это сделать. Проблема, с которой я сталкиваюсь, заключается в том, что когда я закрываю всплывающее окно с помощью редактора и снова открываю его для редактирования, выпадающие списки и меню остаются открытыми, как вы можете видеть на скриншотах.
скриншоты удалены, см. Ниже для скринкаста
Я использую tiny_mce.js , и каждый раз, когда страница загружается, эта функция выполняется:
function initScriptEditor()
{
jQuery1_6_2.getJSON("/DeliDete/listTemplateVariables",
function(result)
{
// Creates a new plugin class and a custom listbox
tinymce
.create(
'tinymce.plugins.ExamplePlugin',
{
createControl : function(n, cm)
{
switch(n)
{
case 'variablesMenu':
var total = parseInt(result.size, 10);
var variables = new Array();
for( var i = 0, j = 0; j < total; i = 5, j )
{
variables[i] = result.values[j].level;
variables[i 1] = result.values[j].group;
variables[i 2] = result.values[j].displayed_name;
variables[i 3] = result.values[j].name;
variables[i 4] = result.values[j].query;
}
var c = cm
.createMenuButton(
'variablesListBox',
{
title : 'Variabili',
image : 'javascripts/tiny_mce/template.gif',
icons : false
});
c.onRenderMenu
.add(function(c, m)
{
var subMenuArray = new Array();
var subSubMenuArray = new Array();
var levels = new Array();
var groups;
var template_variables;
for( var levels_i = 0, levels_j = 0; levels_i < variables.length; levels_i = 5, levels_j )
{
if(!isInArray(levels,variables[levels_i]))
{
groups = new Array();
levels[levels_j] = variables[levels_i];
// aggiungo menu
// livello
subMenuArray[levels_j] = m.addMenu(
{
title : levels[levels_j]
});
// aggiungo tutti i
// gruppi per quel
// livello
for( var groups_i = 1, groups_j = 0; groups_i < variables.length 1; groups_i =5, groups_j )
{
if(variables[groups_i - 1] == levels[levels_j] amp;amp; !isInArray(groups,variables[groups_i]))
{
template_variables = new Array();
groups[groups_j] = variables[groups_i];
// aggiungo menu
// gruppo
subSubMenuArray[groups_j] = subMenuArray[levels_j].addMenu(
{
title : groups[groups_j]
});
// aggiungo tutte
// le variabili
// per quel
// gruppo
for( var variables_i = 2, variables_j = 0; variables_i < variables.length 2; variables_i =5, variables_j )
{
if(variables[variables_i - 2] == levels[levels_j] amp;amp; variables[variables_i - 1] == groups[groups_j] amp;amp; !isInArray(template_variables,variables[variables_i]))
{
template_variables[variables_j] = variables[variables_i];
// //aggiungo
// menu
// item
// variabile
subSubMenuArray[groups_j].add(
{
title : variables[variables_i],
onclick : function()
{
tinyMCE.activeEditor.execCommand('mceInsertContent',false,variables[findValue(variables,this.title)]);
}
});
}
}
}
}
}
}
});
return c;
}
return null;
}
});
// Register plugin with a short name
tinymce.PluginManager.add('templatevariables',
tinymce.plugins.ExamplePlugin);
tinyMCE
.init(
{
language : "it",
mode : "exact",
elements : "editor_editorText",
theme : "advanced",
skin : "o2k7",
plugins : "-templatevariables,searchreplace,pagebreak,advhr,insertdatetime,preview,print,table,template,paste,autoresize,advlist,contextmenu,inlinepopups,nonbreaking",
theme_advanced_buttons1 : "newdocument,|,cut,copy,paste,pastetext,pasteword,selectall,|,search,replace,|undo,redo,|,bullist,numlist,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,fontselect,fontsizeselect,formatselect",
theme_advanced_buttons2 : "outdent,indent,|,image,|,preview,|,forecolor,backcolor,|,insertdate,inserttime,|,advhr,removeformat,|,sub,sup,|,charmap,print,|,template,variablesMenu",
theme_advanced_buttons3 : "tablecontrols,table,row_props,cell_props,delete_col,delete_row,col_after,col_before,row_after,row_before,split_cells,merge_cells,|,nonbreaking,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
// theme_advanced_resizing : true,
paste_block_drop : true,
dialog_type : "modal",
plugin_insertdate_dateFormat : "%d-%m-%Y",
nonbreaking_force_tab : true,
pagebreak_separator : "page-break-after: always;"
});
fillTextBoxFromProposte();
});
}
Может ли проблема заключаться в том, что он перезагружается каждый раз, когда я открываю всплывающее окно colorbox? Искренне я так не думаю, но поскольку я новичок в этом мире, я не могу знать наверняка..
Есть ли функция, которая собирает все пункты меню, которые можно открыть, и закрывает их?
Редактировать: я добавил скринкаст, чтобы вы могли видеть, что происходит
Комментарии:
1. можете ли вы открыть jsfiddle.net ?
2. Что вы имеете в виду? Открыть его в моем браузере? Пожалуйста, объясните свой комментарий. Спасибо!
3. вы можете открыть jsfiddle, используя форму в jsfiddle.net . Другие пользователи могут отслеживать вашу проблему и даже создавать решение.
4. Хорошо, теперь я понимаю. Я не знал, как использовать jsfiddle.net . Я хотел бы поблагодарить вас за ваши усилия, но я думаю, что загружать рабочий пример в jsfiddle слишком сложно, потому что это веб-приложение представляет собой сложную смесь ajax, javascripts, библиотек, jsp и удачи: D Я полагаю, что я поместил здесь всю необходимую информацию, но она далека отзапуск примера..
5. жаль. единственный быстрый и грязный способ, который приходит на ум, — закрыть эти поля после повторного открытия страницы. Что-то вроде $(document) . ready(){$(‘#id_to_box’).hide();}
Ответ №1:
Я исправил эту ошибку, вставив:
tinymce.get(«editorID»).remove();
в моей функции закрытия всплывающего окна. Я думаю, что это была проблема, вызванная дублированием идентификатора для экземпляров, потому что они никогда не уничтожались, и каждый раз, когда я загружал страницу, генерировалась другая.