Por ejemplo, me gustaría que el contenido de un campo de texto se copie al portapapeles cuando hago clic en él. A continuación, se debe mostrar una nota en la posición del ratón de este clic. Todo esto funciona bien en la medida en que puedo asignar una clase al campo de texto relevante o cualquier elemento.
$(document).ready(function(){ $(".click-n-copy").click(function (e) { $(this).select(); navigator.clipboard.writeText($(this).text()); displaySuccessMessage(e.pageX,e.pageY,"copied"); }) }); function displaySuccessMessage(x,y,text) { msg_width = 80; x = x - (msg_width/2); $('#successMessageTemp').remove(); $("body").append("<div id='successMessageTemp' style='text-align:center;vertical-align:middle;width:"+msg_width+"px;position:absolute;top:"+y+"px;left:"+x+"px;border:0px solid grey;background:white;margin:2px;display:none'>" + text + "</div>"); $("#successMessageTemp").html(text); $("#successMessageTemp").show('slow'); setTimeout('$("#successMessageTemp").hide("slow")',2000); }Ahora me gustaría hacer lo mismo con las palabras en los textos de descuento (rebaja estándar = no hay clases posibles para los enlaces).
Entonces, puedo convertir esas palabras en enlaces y llamar a una función que hace todo (copiar, mostrar mensaje).
Pero, ¿cuál es la mejor manera de hacerlo? Necesito la posición del mouse en el momento del clic utilizable en esta función. ¿Significa esto que tengo que hacer eventlistener para todos los eventos de clic y movimientos del mouse solo para capturar algunos clics posibles?
¿O hay un mejor camino? ¿Puedo consultar la posición del mouse una vez como una instantánea en lugar de realizar un seguimiento permanente?
Intenta usar esto:
function printMousePos(event) { console.log("clientX: " + event.clientX + - clientY: " + event.clientY); } document.addEventListener("click", printMousePos);MouseEvent.clientX Solo lectura La coordenada X del puntero del mouse en coordenadas locales (contenido DOM).
MouseEvent.clientY Solo lectura La coordenada Y del puntero del mouse en coordenadas locales (contenido DOM).