Pergunta

Atualmente estou tentando criar uma página web para um computador de tela de toque, e tenho notado que (com os meus dedos gordos) que eventos onclick são realmente difíceis de gatilho, como a área de superfície do meu dedo geralmente faz com que o cursor de se mover enquanto I "clique".

A solução que eu quero usar é o encaminhamento de onmousedown eventos de onclick. Como posso fazer este trabalho?

A melhor resposta seria ao longo das linhas de:

<input type="radio" onmousedown="this.onclick()"/>

(mas é claro em uma condição de trabalho)

EDIT: Meu exemplo específico é para botões de rádio - quando se é verificado os outros são desmarcada; Eu não quero ter que replicar esse comportamento em um evento personalizado quando o navegador dá-la para mim gratuitamente.

NOTA: Depois de ter editado e feedback recebido, eu acho que talvez eu poderia estar no caminho errado ... talvez não seja a função "clique" em um botão de rádio que realmente faz a seleção: novas sugestões boas-vindas ...

Foi útil?

Solução

Ok, depois de suas edições, torna-se mais clara - o que você quer fazer é simular um usuário clicar no controle quando o evento mousedown é acionado.

Duas opções:

  1. Você pode acionar o evento DOM - este tutorial sobre eventos DOM discute esta (veja eventos de disparo manualmente seção); Firing eventos javascript forrações similar.
  2. Set onmouseout="this.checked = true;", ou seja, clicando no botão de rádio "cheques" / seleciona o botão de opção.

Outras dicas

Por que não apenas manipular o evento mousedown?

Eu sei que você não mencionou isso na questão, mas se acontecer de você estar usando jQuery, seria realmente muito fácil:

$().live('mousedown', function() { this.click(); });

Talvez isso funciona para você

document.getElementById("yourinput").onmousedown = function() {
   this.click();
}

Além disso, você poderia estilo seus botões de entrada / campos para ser um pouco maior, para melhor acessibilidade via o ponteiro.

É melhor ter uma única função para lidar com ambos os eventos, por exemplo.

var function = foo(e) {
   ...
};

<input onclick="foo();" onmousedown="foo();"/>

Melhor ainda utilizar discreto JavaScript, por exemplo, (Se você estivesse usando YUI):

<input id="input-el"/>

var function = foo(e) {
   ...
};

var Event = YAHOO.util.Event;

Event.on('input-el', 'click', foo);
Event.on('input-el', 'mousedown', foo);
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top