>웹 프론트엔드 >JS 튜토리얼 >TinyMCE가 AjaxForm을 제출하고 데이터 Solution_javascript 기술을 얻지 못했습니다.

TinyMCE가 AjaxForm을 제출하고 데이터 Solution_javascript 기술을 얻지 못했습니다.

WBOY
WBOY원래의
2016-05-16 16:10:591075검색

이 글에서는 TinyMCE가 AjaxForm을 제출할 때 데이터를 얻을 수 없는 문제에 대한 해결 방법을 분석합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

AjaxForm을 사용하기 전에는 TinyMCE를 사용하여 댓글 내용을 편집하는 작은 웹 양식을 만들었습니다. 사용자 경험을 조금 높이려면 AjaxForm을 사용하여 Ajax 제출을 구현하면 됩니다. 그런데 예상치 못한 일이 일어났습니다. 즉, 제출할 때마다 처음 제출할 때 AjaxForm은 현재 편집된 주석 내용, 즉 TextArea의 내용을 가져올 수 없습니다. TextArea의 내용을 제출하려면 다시 제출을 클릭해야 합니다.

핵심은 TinyMCE의 콘텐츠가 제출 전에 TextArea로 업데이트되지 않는다는 것입니다. 그래서 제출하기 전에 AjaxForm에 이벤트 바인딩이 있는지 확인하고 싶었는데 beforeSubmit 이벤트에 formData의 내용이 채워져 있는 것을 발견했습니다. 여기서 현재 TinyMCE의 내용을 채울 수는 있지만 항상 그렇지 않다는 느낌이 듭니다. 아주 예쁘다.

이 문제를 해결할 수 있는 다른 방법이 있는지 알아보기 위해 AjaxForm의 소스 코드를 확인해 본 결과 AjaxForm 작성자가 이 문제에 대한 통합 솔루션을 제안한 것으로 나타났습니다. 구체적인 소스 코드는 다음과 같습니다. 🎜>

1. js 코드는 다음과 같습니다.


코드 복사 코드는 다음과 같습니다.
// 양식 데이터를 추출하기 전에 조작하기 위한 후크
//tinyMCE 또는 FCKEditor와 같은 리치 편집기와 함께 사용하기에 편리합니다
바르베토 = {};
this.trigger('form-pre-serialize', [this, options, veto]);
if (veto.veto) {
log('ajaxSubmit: 양식 사전 직렬화 트리거를 통해 검토된 제출');
이것을 돌려주세요;
}
2. FCKEditor와 유사:

코드 복사 코드는 다음과 같습니다.
// 'ajaxForm'을 사용하여 폼 바인딩
$('#commentForm').ajaxForm(옵션);
// form-pre-serialize 이벤트를 바인딩하고 form-serilaize 이벤트를 트리거하기 전에 TinyMCE 데이터를 텍스트 영역에 저장합니다
$('#commentForm').bind('form-pre-serialize', function(event, form, options, veto) {
tinyMCE.triggerSave();
});
이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.