ContentTools.js, в результате чего я не знаю

Я недавно наткнулся на ContentTools.js, и я подумал, что это может быть приятное дополнение к сайту, над которым я работаю. Прохождение начального/учебного курса не дает мне нигде - скрипт не работает, но я смотрю на него.ContentTools.js, в результате чего я не знаю

Копирование одних и тех же скриптов с авторской страницы или их запуск из мастер-бинов, но выполнение на фактическом веб-сайте не выполняется.

Единственное, что сработало для меня (на пустой странице html), было то, что скрипт загружал редактируемые поля, стирающие его содержимое, либо сохраненное, либо отмененное редактирование (если это имеет смысл и смысл для вас).

$(document).ready(function() { 
 

 
     window.onload = function() { 
 
     var editor; 
 
     editor = ContentTools.EditorApp.get(); 
 
     editor.init('.editable', 'data-name'); 
 
     editor.bind('save', function(regions) { 
 
      var xhr, payload, name; 
 
      this.busy(true); 
 
      payload = new FormData(); 
 
      for (name in regions) { 
 
      if (regions.hasOwnProperty(name)) { 
 
       payload.append(name, regions[name]); 
 
      } 
 
      } 
 

 
      function onStateChange(ev) { 
 
      if (ev.target.readyState == 4) { 
 
       editor.busy(false); 
 
       if (ev.target.status == '200') { 
 
       new ContentTools.FlashUI('ok'); 
 
       } else { 
 
       new ContentTools.FlashUI('no'); 
 
       } 
 
      } 
 
      } 
 

 
      xhr = new XMLHttpRequest(); 
 
      xhr.addEventListener('readystatechange', onStateChange); 
 
      xhr.open('POST', '/save-my-page'); 
 
      xhr.send(payload); 
 
     }); 
 
     }).call(this);

<link href="http://getcontenttools.com/styles/content-tools.css" rel="stylesheet" /> 
 
<script src="http://getcontenttools.com/scripts/content-tools.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 
    <p class="editable" data-name="c1">asd</p> 
 
    <p class="editable" data-name="c2">123</p> 
 
    <p class="editable" data-name="c3">asd123</p> 
 

 
    <div class="ct-app"> 
 
    <div class="ct-widget ct-ignition ct-ignition--ready ct-widget--active"> 
 
     <div class="ct-ignition__button ct-ignition__button--edit"></div> 
 
     <div class="ct-ignition__button ct-ignition__button--confirm"></div> 
 
     <div class="ct-ignition__button ct-ignition__button--cancel"></div> 
 
     <div class="ct-ignition__button ct-ignition__button--busy"></div> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

OFC все библиотеки загружены и нет JS ошибки. Это просто не работает.

источник

2015-10-20 Marcin Buglewicz

Прежде всего, у вас есть ошибка в коде, некоторые скобки не выровнены, также вы должны иметь один элемент div вокруг ваших элементов p и редактор инициализации вокруг него, в этом случае он будет инициализировать редактор для каждого p, здесь fiddle http://jsfiddle.net/zx4sw47L/

PS Существует проблема с загрузкой шрифтов из-за проблемы междоменной, но пример работает.

источник

2015-10-20 09:57:28 Grissom

Я также начинаю использовать getContentTools. Из того, что я понимаю, у вас есть какая-то ошибка в вашей HTML-разметке и вы теряете другой файл JS Инициализировать getContentTools

<!DOCTYPE html> 
<html> 
    <head> 
      <link href="http://getcontenttools.com/styles/content-tools.css" rel="stylesheet" /> 
      <script src="http://getcontenttools.com/scripts/content-tools.js"></script> 
      <script src="/path/to/editor.js"></script> 
    </head> 
    <body> 
     <div data-editable data-name="c1"> 
      <p class="editable">asd</p> 
     </div> 
     <div data-editable data-name="c2"> 
      <p class="editable">123</p> 
     </div> 
     <div data-editable data-name="c3"> 
      <p class="editable">asd123</p> 
     </div> 
     <!-- this should be deleted as it is generated by getContentTools --> 
     <!-- 
     <div class="ct-app"> 
      <div class="ct-widget ct-ignition ct-ignition--ready ct-widget--active"> 
      <div class="ct-ignition__button ct-ignition__button--edit"></div> 
      <div class="ct-ignition__button ct-ignition__button--confirm"></div> 
      <div class="ct-ignition__button ct-ignition__button--cancel"></div> 
      <div class="ct-ignition__button ct-ignition__button--busy"></div> 
     </div> 
     --> 
    </body> 
</html>

Файл editor.js должен выглядеть так, чтобы начать

window.addEventListener('load', function() { 
    var editor; 

});

Надежда это помогает

источник

2016-06-09 08:47:35 Maxence

ContentTools.js, в результате чего я не знаю

ответ

Смежные вопросы