jQuery .focus() und .blur() funktioniert nicht in Chrome oder Safari

Erstelle ich ein Umfrage-Formular, das muss jede Frage und Antworten hervorgehoben (Wechsel der Hintergrundfarbe), wenn der Benutzer den Fokus auf Sie. .focus() und .blur() funktioniert in Firefox und IE, aber nicht ganz in Safari und Chrome. Ich habe auch versucht .focusin() und .focusout() mit dem gleichen Ergebnis. EDIT: Klick nicht ausgelöst, der focus-Ereignis, aber die Tab durch die Eingabefelder funktioniert. Ich sage nicht ganzweil es funktioniert für text-Eingänge, Eingänge auswählen und textarea-Eingänge, aber keine radio-und checkbox-inputs.

$(document).ready(function()
 {
    $("form li").focusin(function()
  {
   $(this).addClass("over");
  }).focusout(function()
  {
     $(this).removeClass("over");
  });
 });

Diese wird angewandt, um Blöcke von html-ähnlich wie diese:

<li>
    <label for="webmail" class="desc">Email</label>
    <input type="text" name="webmail" id="webmail" />
</li>
<li>
    <label for="business" class="desc">Purpose of your Charter Flight:</label>
    <div>
        <span>
            <input type="radio" name="purpose" id="business" class="radio" />
            <label class="choice" for="business">Business</label>
        </span>
        <span>
            <input type="radio" name="purpose" id="pleasure" class="radio" />
            <label class="choice" for="pleasure">Pleasure</label>
        </span>
    </div>
</li>

Habe ich versucht andauernd an und aus schaltet, aber ich bin auf der Suche nach einer eleganten Lösung, die nicht die Verwendung von gewundenen Logik zu machen, damit es funktioniert. Irgendwelche Ideen?

InformationsquelleAutor der Frage Eric | 2010-07-27

  1. 3

    Stieß ich auch auf dieses problem eine lange Zeit, und seltsamerweise war es ein radio-button, was mir Kummer.

    Versuchen Sie es mit jQuery.change() statt, hier ist ein Beispiel aus, das problem hatte ich

    $("input#zendesk-dropbox-askedbefore, input#zendesk-dropbox-newhere").change(function() {
    $("label#zendesk-dropbox-label-askedbefore, label#zendesk-dropbox-label-newhere").toggleClass('zendesk-dropbox-label-highlight');
});

    In einem Fall ist es unklar, aus meiner verrückten Einsatz von ID-Namen, input#zendesk-dropbox-askedbefore & input#zendesk-dropbox-newhere sind beide radio-buttons.

    InformationsquelleAutor der Antwort jakeisonline

  2. 1

    Dachte ich über es auf der Fahrt nach Hause Letzte Nacht und dachte, es auf meinem eigenen, es ist vielleicht nicht die eleganteste Lösung, aber es funktioniert sicherlich.

    $(document).ready(function()
    {
       $("textarea, input, select, .radio, .checkbox").click(function()
        {
            $("form li.over").toggleClass("over");
            $(this).parents("li").toggleClass("over");
        });
    });

    Trotzdem danke!

    InformationsquelleAutor der Antwort Eric

  3. 0
    //In js area write following method
$('#chkRikin').focus(function() {
alert('Say Hi Rikin');
});


//in html area write following code anenter code hered test it your self
<input type="checkbox" onclick="this.focus()" onblur="yourMethod()" />

it works in google crom

    InformationsquelleAutor der Antwort Rikin Adhyapak

Schreibe einen Kommentar