document.getElementById (id) .focus () funktioniert nicht für Firefox oder Chrome

Wann immer ich ein Änderungsereignis mache, wird es innerhalb dieser Funktion validiert, aber der Fokus kommt nicht, den ich benutze document.getElementById('controlid').focus();

Ich verwende Mozilla Firefox und Google Chrome, beide funktionieren nicht. Ich möchte keinen IE. Kann mir jemand sagen, was mir der Grund sein könnte.

Danke im Voraus

Hier ist der Code:

var mnumber = document.getElementById('mobileno').value; 
if(mnumber.length >=10) {
    alert("Mobile Number Should be in 10 digits only"); 
    document.getElementById('mobileno').value = ""; 
    document.getElementById('mobileno').focus(); 
    return false; 
}

Versuchen Sie es mit einem Timer:

var mnumber = document.getElementById('mobileno').value;
if (mnumber.length >=10) 
{ 
    alert("Mobile Number Should be in 10 digits only");
    document.getElementById('mobileno').value = "";
    window.setTimeout(function ()
    {
        document.getElementById('mobileno').focus();
    }, 0);
    return false;
}

Ein Timer mit einer Anzahl von 0 wird ausgeführt, wenn der Thread inaktiv wird. Wenn dies nicht hilft, versuchen Sie stattdessen den Code (mit dem Timer) im Ereignis onblur.

2 Dinge zu erwähnen, wenn focus()nicht funktioniert:

• Verwenden Sie diese Funktion, nachdem Sie sie an das übergeordnete Element angehängt haben
• Wenn die Konsole ausgewählt ist, wird das Element nach dem Aktualisieren der Seite nicht fokussiert. Wählen Sie daher beim Testen die Webseite aus (klicken Sie darauf)

Diese Methode funktioniert sowohl in Firefox als auch in Chrome ohne setTimeOut().

window.setTimeout(function () { 
    document.getElementById('mobileno').focus(); 
}, 0); 

Das hat auch bei mir funktioniert. Firefox würde den Wert meines Elements festlegen, ihn aber nicht fokussieren.

Mein Fall war etwas anders. Ich habe versucht, focus()eine Eingabe über eine Browser-Entwicklerkonsole vorzunehmen. Es stellte sich heraus, dass es irgendwie die Eingabe störte, und als ich die Konsole minimierte, funktionierte alles wie erwartet . Ich verstehe, dass dies keine programmatische Lösung ist, aber falls jemand dies wie ich in einer Suchmaschine gefunden hat, besteht die Möglichkeit, dass diese Informationen hilfreich sind.

Nicht alle Elemente sind fokussierbar, aber standardmäßig gibt es ein tabindex-Attribut, um dies zu beheben.

Wenn Sie einem Element tabindex = zuweisen:

Es wird fokussierbar. Ein Benutzer kann die Tabulatortaste verwenden, um vom Element mit weniger positivem Tabindex zum nächsten zu wechseln. Die Ausnahme ist ein spezieller Wert. Tabindex = "0" bedeutet, dass das Element immer das letzte ist. Der tabindex = -1 bedeutet, dass ein Element fokussierbar wird, aber die Tabulatortaste überspringt es immer. Nur die focus () -Methode funktioniert

Eine weitere Sache, die Sie zu dieser Liste hinzufügen müssen, um Folgendes zu überprüfen:

Stellen Sie sicher, dass das Element, das Sie fokussieren möchten, zum Zeitpunkt des Fokussierens weder selbst noch in einem Element mit "display: none" enthalten ist.

So stellen Sie den Fokus wieder her, um das Textfeld für das Kennwort in Javascript erneut einzugeben:

window.setTimeout(function() { document.forms["reg"]["retypepwd"].focus(); },0);

Hier regist der Name des Registrierungsformulars.

Ich vermute, der Grund dafür ist, dass das Browser-Rendering im selben Thread wie Javascript und setTimeout (function () {}, 0) ausgeführt wird. Stellt die Javascript-Funktion in setTimeout in die Warteschlange, um sie auszuführen, wenn der Browser inaktiv wird. Wenn jemand eine ausführlichere Erklärung hat, teilen Sie diese bitte mit.

setTimeout(function(){ 
 if(document.getElementById('mobileno')){
  document.getElementById('mobileno').focus();
 } 
},0);

Ich weiß, dass dies ein esoterischer Anwendungsfall sein kann, aber ich hatte Probleme, eine Eingabe zu erhalten, um den Fokus bei der Verwendung des Angular 2-Frameworks zu erhalten. Das Aufrufen von focus () hat einfach nicht funktioniert, egal was ich getan habe.

Letztendlich wurde mir klar, dass Angular es unterdrückte, weil ich kein [(ngModel)] für den Eingang festgelegt hatte. Einstellen löste es. Hoffe es hilft jemandem.

Versuchen Sie, auf das Element zu verweisen, bevor das Laden des DOM abgeschlossen ist?

Ihr Code sollte in Body Load (oder einer anderen Funktion, die ausgeführt werden soll, wenn das DOM geladen wurde, z. B. $(document).ready()in jQuery) ausgeführt werden.

body.onload = function() { 
    // your onchange event handler should be in here too   
    var mnumber = document.getElementById('mobileno').value; 
    if(mnumber.length >=10) {
        alert("Mobile Number Should be in 10 digits only"); 
        document.getElementById('mobileno').value = ""; 
        document.getElementById('mobileno').focus(); 
        return false; 
    }    
}

Stellen Sie sicher, dass Sie "id" und "getElementById" wie hier gezeigt verwenden:

<FORM id="my_form" name="my_form" action="">
<INPUT TYPE="text" NAME="somefield" ID="somefield" onChange="document.getElementById('my_form').submit();">
</FORM>

Fügen Sie ein Steuerelement hinzu, in dem Sie den Fokus festlegen möchten, und ändern Sie dann seine Eigenschaft wie unten

<asp:TextBox ID="txtDummy" runat="server" Text="" Width="2" ReadOnly="true" BorderStyle="None" BackColor="Transparent"></asp:TextBox>

Rufen Sie im Codebehind einfach wie unten auf txtDummy.Focus()

Diese Methode funktioniert in allen Browsern.

Das oben vorgeschlagene Zeitlimit hat das Problem in Chrome umgangen. Auf IE8 oder FF3 besteht kein Problem.

Mein Code zum Festlegen des funktionierenden Fokus lautet:

window.setTimeout(function() {
  document.form1.password.focus();
}, 0);

Ihr Fokus arbeitet, bevor Sie false zurückgeben. Danach funktioniert es nicht mehr. Sie versuchen diese Lösung. Kontrolle nach Rückgabe false;

Code in Funktion setzen:

function  validateNumber(){
    var mnumber = document.getElementById('mobileno').value; 
    if(mnumber.length >=10) {
        alert("Mobile Number Should be in 10 digits only"); 
        document.getElementById('mobileno').value = ""; 
        return false; 
    }else{
        return true;
    }
}

Anruferfunktion:

function submitButton(){
        if(!validateNumber()){
            document.getElementById('mobileno').focus();
            return false;
        }
}

HTML:

Input:<input type="text" id="mobileno">
<button onclick="submitButton();" >Submit</button>

Platzieren Sie diese Quelle über Ihrem Modal:

<script>
$('body').on('shown.bs.modal', '#IdYourModal', function () {
    document.getElementById('mobileno').focus();
})
</script>

Eine Sache zu überprüfen, die ich gerade gefunden habe, ist, dass es nicht funktioniert, wenn es mehrere Elemente mit der gleichen ID gibt. Es ist kein Fehler, wenn Sie dies versuchen, es schlägt nur stillschweigend fehl

Versuchen location.href='#yourId'

So was:

<button onclick="javascript:location.href='#yourId'">Show</button>