我想做這樣的訊息輸入。
但我有一個問題如何獲取檔案資料，我在文本區域上拖放或 Ctrl V 進行上傳。我為此使用 Riot.js 和 Symfony。
這是我未完成的代碼：
<form method="post" enctype="multipart/form-data" onsubmit="{ handleFileSubmit }">
<textarea class="form-control" id="message" onpaste="{ handleFilePaste }" required>
</textarea>
</form>
handleFilePaste(e) {
e.preventDefault();
console.log(e.clipboardData.items);
console.log(window.navigator.clipboard);
}
但是當我在本地驅動器上復制檔案并將其粘貼到文本區域時，上面的 console.log() 沒有得到任何檔案資料。如果有人知道如何做或有一個很好的示例鏈接，請與我分享。
如果可以，請分享拖放示例（重要：輸入欄位必須是文本區域）。
我希望有好的答復。謝謝你。
uj5u.com熱心網友回復：
當我過去必須做類似的事情時，我沒有將事件監聽器附加到表單本身，而是document如下例所示（您可以執行并粘貼某些內容，它可以作業），從技術上講，我不確定是否它在 textarea 上的作業方式相同，但它確實在檔案上作業，在哪里監聽粘貼事件并不重要，因為當你檢測到正在粘貼的檔案時你決定做什么。
function handleFilePaste(e) {
const items = (e.clipboardData || e.originalEvent.clipboardData).items;
console.log(items);
for (let index in items) {
const item = items[index];
if ( item.kind === 'file' ) {
return item.getAsFile();
}
}
}
document.addEventListener('DOMContentLoaded', () => {
document.onpaste = function(e){
const file = handleFilePaste(e);
console.log(file);
if ( !file ) { return; }
}
});<form method="post" enctype="multipart/form-data" onsubmit="{ handleFileSubmit }">
<textarea class="form-control" id="message" placeholder="Paste something" required></textarea>
</form>轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/467719.html
標籤：javascript php 交响乐 riot.js