クールデルタからHtml Textareaを解析する

Question

こんにちは、私はhtml E-Magazineプロジェクトに取り組んでいます。私は、テキストエリアにまたは段落タグ（例にクイルのためのデルタを渡す必要があり、私はHTMLテキストエディタを（私はクイルを使用しています）追加した

：質問をするために、我々はスタックオーバーフローに使用するもののようなと同じようにプレビューする）。

私はいくつかの参照を行ってきましたが、私はの内容を取得することができません、私はこれに新しいです、新しい。

だから、いずれかの人が私に理解し、適切なコードを表示するのに役立ちます。

私はコードを含んでいませんので、必要に応じてコードを更新しますが、私は何をしようとしているのかを説明するために画像をアップロードしました。

ありがとうございます。

Picture: This is how i wanted

Answer 1

これは、実際には2つの部分の質問です。段落の内容を更新に関しては、あなたはこのようにクイルは「text-変更」ハンドラを登録する必要があります。

quill.on('text-change', function(delta, oldDelta, source) { 

これはhttps://quilljs.com/docs/api/#text-changeから取られています。残りの機能はdelta（https://quilljs.com/docs/delta/）を処理して有効なHTMLコード（Convert Quill Delta to HTML）に変換し、段落タグのinnerHTMLをそのHTMLコードに設定します。

MySQLデータベースにデータを追加する場合は、PHPページへのXMLHttpRequestを使用してデータをデータベースに挿入します。 'text-change'ハンドラでリクエストを行うことができます。これによりデータベースがすべての作業を完了できるようになりますが、多くの人が異なるプロジェクトで同時にエディタを使用することができれば、データベース上でパフォーマンスの問題が発生する可能性があります。それが本当に懸念される場合は、要求を行う保存関数を呼び出す保存ボタンをページに追加するとよいでしょう。あなたはquill.getContents()（https://quilljs.com/docs/api/#getcontents）でクイルエディタの内容を得ることができます。