disable background color of text when copy pasting

Anyone know how to disable text background color when copy pasting ?
9 Replies
Avinash
Avinash2y ago
As you can see when i copy pasted text background color is included in that field
Coder_Carl
Coder_Carl2y ago
Is it pasting it within spans? And if so I'm presuming inline styling is being added. Just wait for the event and grab the clipboard, grab the inner contents of the html and put it into a clean span
Avinash
Avinash2y ago
No, its just a div. i couldnt replicate it in code pen. thisis how i used
<div class="comment-box" contenteditable="true"data-placeholder="Write a comment..."></div>
<div class="comment-box" contenteditable="true"data-placeholder="Write a comment..."></div>
[contenteditable="true"]:empty:not(:focus):before {
content: attr(data-placeholder);
}

[contenteditable="true"]:focus:empty::after {
outline: 1px solid var(--label-teal);
border: none;
border-radius: var(--border-radius);
}
[contenteditable="true"]:empty:not(:focus):before {
content: attr(data-placeholder);
}

[contenteditable="true"]:focus:empty::after {
outline: 1px solid var(--label-teal);
border: none;
border-radius: var(--border-radius);
}
Coder_Carl
Coder_Carl2y ago
Ah I'm not sure about content editable stuff sorry. I'm sure that you'd still be able to listen for the event and then copy the inner text placing within a div
Unknown User
Unknown User2y ago
Message Not Public
Sign In & Join Server To View
Avinash
Avinash2y ago
if i implement ::section{background-color:transparent} then the user visualize the selection i dont want that. the only issue is when user copy paste text from various sources, its also copying the background color of the container which the text is placed
Unknown User
Unknown User2y ago
Message Not Public
Sign In & Join Server To View
Avinash
Avinash2y ago
im selection i used this
JS var ce = document.querySelectorAll("[contenteditable]");

ce.forEach((value) => {
value.addEventListener("paste", (e) => {
e.preventDefault();
var text = e.clipboardData.getData("text/plain");
document.execCommand("insertText", false, text);
});
});
JS var ce = document.querySelectorAll("[contenteditable]");

ce.forEach((value) => {
value.addEventListener("paste", (e) => {
e.preventDefault();
var text = e.clipboardData.getData("text/plain");
document.execCommand("insertText", false, text);
});
});
worked like a charm thumbup
Unknown User
Unknown User2y ago
Message Not Public
Sign In & Join Server To View
Want results from more Discord servers?
Add your server