Desidero i miei pulsanti della barra degli strumenti (ExtJS) non per catturare l'attenzione sulla pagina Web quando viene fatto clic, ma per fare la loro "cosa" lasciando l'attenzione invariata dal clic. Come lo faccio?Come si ottengono i pulsanti Get per mettere a fuoco?
Non penso che ci sia un modo semplice per fare ciò che si vuole fare perché è il comportamento predefinito del browser.
Si potrebbe ovviamente sfocare() il pulsante non appena viene cliccato, ma ciò semplicemente deselezionerebbe tutto. Per fare in modo che l'oggetto precedentemente ripristinato si concentri, dovresti creare una "memoria" di sorta aggiungendo un gestore di sfocatura per ogni elemento per tenere traccia di quale elemento aveva/ha perso l'ultimo fuoco (salva l'id dell'elemento in un globale e aggiornarlo quando un elemento perde lo stato attivo).
Poiché i pulsanti della barra degli strumenti sono solo elementi di pulsante HTML ordinari, questo è un comportamento effettivo del browser e è necessario pensarci due volte prima di modificarlo. Ma comunque ...
Dovresti essere in grado di impedire al riquadro di ricevere il focus semplicemente restituendo false dal gestore onclick.
Grazie Rene Ho pensato che fosse l'approccio giusto, ma non sembrava funzionare quando ho provato. ATM Ho implementato una soluzione sgradevole in cui su ogni Form ho impostato i valori di default: {onBlur: fieldExit} dove fieldExit colloca l'oggetto chiamante in una variabile lastField, quindi alla fine del gestore dei pulsanti (tutti usano lo stesso) Faccio lastField.focus(). Funziona per i campi di testo, ma stranamente non per le checkbox (non ho ancora testato altri). –
è possibile evitare che il pulsante * mantenga * attivo, ma non è possibile riportare lo stato attivo sull'elemento precedente senza tenere traccia di tale valore. – annakata
Quando si attiva il clic, è troppo tardi per annullare l'attivazione. Come ho detto sopra, la prevenzione del comportamento predefinito dovrebbe essere eseguita in onmousedown. Non impedirà "onclick" ma impedirà il cambio di messa a fuoco. Almeno nei browser Webkit. – real4x
Forse dovresti provare a usare stateful e modificare le proprietà di stato per i campi modulo o quant'altro per ottenere l'attenzione indietro?
document.activeElement memorizza l'elemento attualmente focalizzato.
Quindi, sulla barra degli strumenti, è possibile aggiungere un "MouseDown" handler a questa funzione:
function preventFocus() {
var ae = document.activeElement;
setTimeout(function() { ae.focus() }, 1);
}
Prova questo esempio:
<html>
<head>
<script>
function preventFocus() {
var ae = document.activeElement;
setTimeout(function() { ae.focus() }, 1);
}
</script>
</head>
<body>
<input type="text"/>
<input type="button" onmousedown="preventFocus()" onclick="alert('clicked')" value="Toolbar" />
</body>
</html>
Non penso che funzionerà: nel momento in cui è possibile eseguirlo, il pulsante è l'elemento attivo. – annakata
Funzionerà. La variabile ae è memorizzata all'interno della chiusura e non cambierà. – Alsciende
Testato su Firefox, Chrome, Opera, IE7: funziona. Non riesce su Safari. – Alsciende
vorrei collegare una sfocatura listener di eventi per tutti i campi. Questo ascoltatore dovrebbe salvare il campo, che ha perso lo stato attivo, in una variabile globale.
Quindi tutti i pulsanti della barra degli strumenti dovrebbero ottenere un listener di eventi di attivazione. Questo ascoltatore dovrebbe focalizzare il campo, che è stato salvato come descritto sopra.
Questo codice dovrebbe funzionare, anche se non provarlo
Annullamento il comportamento predefinito di onmousedown impedisce un elemento di ottenere la messa a fuoco:
// Prevent capturing focus by the button.
$('button').on('mousedown',
/** @param {!jQuery.Event} event */
function(event) {
event.preventDefault();
}
);
<script>
function focusor(){
document.getElementById('focus').focus;
}
document.onkeydown = focusor;
document.onclick = focusor;
</script>
<div style="width: 0px; height: 0px; overflow: hiddden;">
<button id="focus"></button>
</div>
Quello che ho trovato, è dovrai creare un elemento fittizio, ho trovato che i pulsanti funzionano meglio in questa situazione. metti il bottone in un div e fai il div 0px.
[non fanno la visualizzazione nessuno div, alcuni browser semplicemente ignorarlo]
Fondamentalmente ogni clic o pressione di un tasto, si concentrerà su questo pulsante manichino. Ho avuto un progetto molto simile e ogni volta che hanno premuto il tasto giù ha selezionato il primo pulsante della pagina, questo si focalizza sul pulsante più e più volte.
Un po 'sollevato, ma funziona.
+1 esattamente a destra. – annakata
Thabks Alan - questo è praticamente quello che sto facendo in questo momento ... appiccicoso, ma (per lo più - ho bisogno di fare le eccezioni) funziona. –
Controlla, questo non è più vero. Vedi la risposta di @ real4x qui sotto. – eremzeit