I am using replace() to replace the bullet points in a text field. It shows up correctly in the console.log but when I use the end function to copy and paste the string into a new text field, it reverts to the original version.
The end goal of the js code is to use a mouse event to copy a selection of text and then be able to paste it into another text field/text editor.
var tooltip, // global variables oh my! Refactor when deploying!
hidetooltiptimer
function createtooltip(){ // call this function ONCE at the end of page to create tool tip object
tooltip = document.createElement('div')
tooltip.style.cssText =
'position:absolute; background:black; color:white; padding:4px;z-index:10000;'
+ 'border-radius:2px; font-size:12px;box-shadow:3px 3px 3px rgba(0,0,0,.4);'
+ 'opacity:0;transition:opacity 0.3s'
tooltip.innerHTML = 'Copied!'
document.body.appendChild(tooltip)
}
function showtooltip(e){
var evt = e || Event
clearTimeout(hidetooltiptimer)
tooltip.style.left = evt.pageX - 10 + 'px'
tooltip.style.top = evt.pageY + 15 + 'px'
tooltip.style.opacity = 1
hidetooltiptimer = setTimeout(function(){
tooltip.style.opacity = 0
}, 500)
}
function getSelectionText(){
var selectedText = ""
if (window.getSelection){ // all modern browsers and IE9+
selectedText = window.getSelection().toString().replace("•","");
//console.log(selectedText)
}
return selectedText
}
function copySelectionText(){
var copysuccess // var to check whether execCommand successfully executed
try{
copysuccess = document.execCommand("copy") // run command to copy selected text to clipboard
} catch(e){
copysuccess = false
}
return copysuccess
}
createtooltip() // create tooltip by calling it ONCE per page. See "Note" below
var copyText = document.getElementById('output')
copyText.addEventListener('mouseup', function(e){
var selected = getSelectionText() // call getSelectionText() to see what was selected
if (selected.length > 0){ // if selected text length is greater than 0
var copysuccess = copySelectionText() // copy user selected text to clipboard
showtooltip(e)
}
}, false)
I have tried changing the syntax of the code, moving the return values around and other string methods. If anyone can help me figure this out I would really appreciate it!
copySelectionText()which goes back to the unedited source.selectedTextvariable does not change what's copied onto the clipboard. So instead, you can do the replacing when you are pasting into the new text field. eg.newTextField.value = getSelectionText().replace...