WordPress TinyMCE 편집기와 함께 WebStorage API 사용

사용자가 WebStorage API을 사용하여 WordPress TinyMCE 편집기에 쓴 데이터를 보관하고 싶습니다. 프론트 엔드에서 편집자 인 one of my plugin을 시작했습니다.WordPress TinyMCE 편집기와 함께 WebStorage API 사용

조건은 텍스트 영역을 채운 후에 사용자가 등록 또는 로그인 여부를 선택할 수 있으며 그 상태에서 페이지를 새로 고침해야합니다. 페이지를 새로 고친 후에도 입력 된 텍스트를 [편집기 사용] 텍스트 영역에 유지하고 싶습니다. WebStorage가 핵심이라고 생각합니다.

하지만 TinyMCE 편집기를 사용하는 필드에 javascript (jQuery)를 트리거 할 수 없습니다. 'tinymce' => false 동안 작업을 할 수 있습니다.

내가 webStorage onKeyUp에 저장할 수있는 방법이 있나요, 다음 중 하나를 TinyMCE에 자바 스크립트를 주입

, 또는 다른 방법으로
?

출처

2017-01-20 Mayeenul Islam

는 WP의 기본 TinyMCE에 인스턴스를 분리하고, 어쩌면 플러그인에서 사용자 정의 lib 디렉토리를로드 할 수 있습니까 ?? 그리고 당신이 좋아하는대로해라. 나는 tinymce에 대한 나쁜 경험을했다. 그리고 무엇을하지 않느냐. 키쌍이 아니라 포커스를 잃어버린 webstorage에 저장하겠다고 제안했다. –

고마워.하지만, 내가 발견 한 모든 가능한 코드로 프론트 엔드에서 TinyMCE를 시작하는데 실패했다. 'wp_editor()'. 프론트 엔드에있는 ''에서 TinyMCE를 트리거하는 데 도움이되는 능동적 인 솔루션이 있다면 많은 도움이 될 것입니다. –

.. 그게 당신을 도울 것입니다 경우 모르겠어요 ,, 이런 일에 초기화 TinyMCE를 시도하지만 난 내 손가락이 당신을 위해 교차 개최 또한 내가 로컬 스토리지를 저장하는 댓글을 달았 OBJ 또한 어떤 종류가있다 SO 부과 한계 ..

// initialize tinymce: 
 
// I loaded it over inline element (div) only cause StackOverflow editor 
 
// can't init normal tinymce with iframe.. 
 
// you have to replace only this div with your custom textare and give it ID 
 
// and reference it in code 
 
// I have choosen to save text on blur but you can do whatever event you need to update localstorage object 
 
tinymce.init({ 
 
    inline: true, 
 
    selector: '#myid', 
 
    height: 100, 
 
    menubar: true, 
 
}); 
 

 
$('#myid').on('blur', function(){ 
 
    var temp = $('#myid').text(); 
 
    console.log(temp); 
 
    // localStorage.setItem('tempTxt', temp ); 
 
})

#myid { 
 
    height: 100px; width: 400px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script> 
 
<link rel="stylesheet prefetch" href="//www.tinymce.com/css/codepen.min.css"> 
 
<link rel="stylesheet" type="text/css" id="u0" href="http://cdn.tinymce.com/4/skins/lightgray/skin.min.css"> 
 

 
<div id=myid>My custom text ..</div>

출처

2017-01-20 20:40:04

WordPress TinyMCE 편집기와 함께 WebStorage API 사용

답변

관련 문제