Questão FC373441
Um programador está desenvolvendo uma aplicação de teclado virtual para acessar a área restrita de um site e precisa obter as coordenadas X e Y relacionadas à posição do ponteiro d
Desenvolvimento Web
FCC · 2019
Um programador está desenvolvendo uma aplicação de teclado virtual para acessar a área restrita de um site e precisa obter as coordenadas X e Y relacionadas à posição do ponteiro do mouse. Para isso, desenvolveu o fragmento de código abaixo, usando jQuery.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(document).mousemove(function(event){
..I..;
});
});
</script>
</head>
<body>
<p>Posição do ponteiro do mouse: <span></span></p>
</body>
Para exibir as coordenadas X e Y relativas à posição do ponteiro do mouse em um elemento do corpo da página cujo atributo , a lacuna I deverá ser preenchida por:
- $("#span").text("X: " + event.pageX + ", Y: " + event.pageY)
- $("span").text("X: " + event.getX + ", Y: " + event.getY)
- documento.write#ponteiro("X: " + event.pageX + ", Y: " + event.pageY)
- $("#ponteiro").text("X: " + event.pageX + ", Y: " + event.pageY)
- document.getElementById("ponteiro") = "X: " + event.pageX + ", Y: " + event.pageY
Mostrar resposta e comentário
Gabarito
D
Comentário do professor
A expressão $("#ponteiro").text("X: " + event.pageX + ", Y: " + event.pageY) faz três coisas importantes em jQuery.
Primeiro, $("#ponteiro") seleciona o elemento pelo id (logo, no HTML deve existir id="ponteiro" em um span ou similar).
Em seguida, o método .text() substitui o conteúdo textual desse elemento, exibindo a string formatada com as coordenadas.
Por fim, event.pageX e event.pageY fornecem as coordenadas do ponteiro relativas ao documento (incluem deslocamento de scroll), obtidas dentro do handler mousemove.
Portanto, essa linha atualiza em tempo real o texto do elemento #ponteiro com os valores X e Y do mouse, de forma simples e correta.
Conteúdo do catálogo FC Concursos · Atualizado em