[英]Get text from textarea and append it to a hidden input
我在這方面真的很難受。 我有一個使用 bootstrap wysiwyg 的模板並具有以下結構(在加載模板時動態添加):
<div class="col-sm-10">
<div class="summernote" style="display: none;"></div>
<div class="note-editor">
<div class="note-dropzone">//content</div>
<div class="note-dialog">//content</div>
<div class="note-handle">//content</div>
<div class="note-popover">//content</div>
<div class="note-toolbar btn-toolbar">//content</div>
<textarea class="note-codable"></textarea>
<div class="note-editable" contenteditable="true">
<p></p>
</div>
</div>
我注意到在檢查代碼時,我在編輯器中編寫的內容被添加到 p 標簽中。
我的問題是,如何“捕捉”用戶在所見即所得文本區域上寫的內容並在通過 $_POST 在 php 中發送時接收它?
到目前為止,我的方法是:
添加到 pa 模糊功能,因此當用戶停止書寫並在外部單擊時,可以將內容復制到隱藏的輸入中
window.onload = function(){ var paragraph = $('.note-editable').find('div').find('p:first'); paragraph.id = 'pr'; $("#pr").blur(function(){ alert("This input field has lost its focus."); }); }
當然,我沒有成功,現在我的頭有點燒。 任何幫助表示贊賞。
只需使用summernote的內置方法獲取代碼,然后使用jQuery將其轉換為文本。
var html = $('.summernote').code();
$('#hiddenField').val($(html).text());
嘗試使用input
事件,處理程序中的this.textContent
來檢索.note-editable
元素中的文本
$(".note-editable").on("input", function(e) { console.log(this.textContent) })
.note-editable { border:1px solid #000; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <div class="col-sm-10"> <div class="summernote" style="display: none;"></div> <div class="note-editor"> <div class="note-dropzone">//content</div> <div class="note-dialog">//content</div> <div class="note-handle">//content</div> <div class="note-popover">//content</div> <div class="note-toolbar btn-toolbar">//content</div> <textarea class="note-codable"></textarea> <div class="note-editable" contentEditable="true"> <p></p> </div> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.