6
로컬 이미지를 선택하고 RAW (BASE64) 이미지를 편집기의 현재 위치에 삽입하려면 사용자 정의/기본 버튼을 TinyMCE 편집기에 추가 할 수 있습니까?TinyMCE 에디터에 버튼을 삽입하여 로컬 파일을 현재 위치에 RAW 이미지로 삽입하는 방법은 무엇입니까?
A
답변
3
방금 시도했습니다. this answer. 위의 URL을 사용하여
window.onload = function() {
document.getElementById("fileName").onchange = function() {
var reader = new FileReader();
reader.readAsDataURL(this.files[0]);
reader.onload = function() {
console.log(reader.result);
document.getElementById("img").src = reader.result;
};
reader.onerror = function (error) {
console.log('Error: ', error);
};
};
};<input type="file" name="fileName" id="fileName" /><br />
<img src="https://dummyimage.com/250x75/000/fff.png&text=Select+an+Image" id="img" style="max-width: 250px; max-height: 75px;" />(콘솔를 참조하거나 요소를 검사하고 찾아 src을)과 inserting an image at the current position, 당신은 캐럿의 현재 위치에서 문서 내부의 이미지를 삽입 할 수 있습니다.
무엇을 시도 했습니까? 단계는 다음과 같을 것입니다 : a) 버튼 추가; b) '업로드 파일'시퀀스를 구동하는 버튼을 클릭합니다. c) 파일을 서버로 보낸다. d) 서버에서 base64 버전을 검색하고 활성 편집기에 삽입합니다. – pbuck
나는 그것을 구현하는 방법과 서버로 보내는 이유를 전혀 모른다. TinyMCE 또는 JS가 클라이언트 측을 변환 할 수 있습니까? – STORM
주석 버튼에 대한 많은 기존 문서가 있습니다. 서버로 전송할 때 문제는 파일을 로컬에서 읽을 수 없다는 것입니다. 웹 서버에 파일을 보낼 수 있습니다. – pbuck