iT邦幫忙

0

將剪貼簿的內容添加 element ?

  • 分享至 

  • xImage

我使用一個編輯器做 summernote
以下方式可以獲取剪貼簿的內容

onPaste: function (e) {
	var text = e.originalEvent.clipboardData.getData('text');

我會使用這個丟到編輯器裡面顯示

$(e.target.parentNode).append(text);

但是在這之前我想知道怎麼樣在丟入編輯器之前加入一個 element 可能是 <div>,然後可以指定一個 class ?
例如貼進去的結果預期會是:

<div class="abc">剪貼簿內容</div>

補充:
只是因為這個剪貼簿通常都是網址,因為我要製作 iframe ,例如 youtube影片嵌入
我的用意是:
當貼上的是youtube網址,則會產生 iframe 再丟回編輯器
產生 iframe 後會清空原本貼上的網址
但這樣我就會有點搞混
我雖然剪貼簿(假設網址)直接貼上編輯器後,網址會在編輯器上,此時也會被存入 text
我要做的是開始 onPaste function 後,剪貼簿上的「網址」可以被清除

看更多先前的討論...收起先前的討論...
你的第二行就是你要的答案了。
你都知道要怎麼丟進去編輯器內了。
換個元素元件一樣使用append。不就是你要的答案了。

同一次看到將答案寫出來的人,還不知道自已已經將答案寫出來了。
難不成,你不懂那一段程式碼的用意嗎?
火爆浪子 iT邦研究生 1 級 ‧ 2018-10-09 11:05:24 檢舉
已補充
說真的,有點還是搞不太清楚你要的東西。
火爆浪子 iT邦研究生 1 級 ‧ 2018-10-09 11:27:20 檢舉
不知道你有沒有用過WP編輯器
假設我貼上 youtube網址,他會直接替換成iframe丟到編輯器
我做法是一樣,只是我不知道怎麼處理「貼上去的網址」清除這個部分
因為如果不清除,編輯器上看到的就是一串網址 + 一個iframe ,但我不需要看到網址
那是一種預定好,俗稱為bb code的做法。
正常來講,你不該去破壞原來的做法,因為那是沒意義的。
你因該得要往其編輯器上的程式去做修正跟修改。
正常來說,其編輯器上,因該會有其對應的js代碼。或是其取代對應的方式才對。
你想利用暴力破壞的方式處理掉。這是不好處理的事,如果不直接處理掉原先的程式。你依然會面臨網址會出現的問題。

過來人跟你說一下好了,其實wp編輯器存在著很死板的運行。直接拿來使用是很好用。但如要做額外處理時,非常的不方便。也不容易處理。

我會建議你找其它的編輯器外掛來處理會比較好。

畢竟wp編輯器其原本的目的是要在wp上這種仿論壇及bolg用的編輯器。
所以出現必要的網址是必然的。(但我記得可以從設定檔來關掉顯示連結的設定)

想用套裝的東西,你要非常去了解其特性,不要自已想要硬幹。你會被搞死的。
火爆浪子 iT邦研究生 1 級 ‧ 2018-10-09 14:43:26 檢舉
我不是用 WP我是用 summernote 編輯器,這個 onPaste也是這個編輯器給的 function
froce iT邦大師 1 級 ‧ 2018-10-09 18:50:59 檢舉
等一下,我之前不是給你code了嗎?
https://ithelp.ithome.com.tw/questions/10190859

範例給你在下方加div...為什麼你不會自己改?不是就用個tag包起來而已?
火爆浪子 iT邦研究生 1 級 ‧ 2018-10-10 17:05:26 檢舉
我貼上網址到編輯器的同時會用這個網址打IG的API,所以我不能在貼上網址的時候加上 ele,否則會沒辦法打IG,這是我有點傷腦筋的問題,不然我也知道怎麼包
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友回答

立即登入回答