jQuery toggle-focus / Weichzeichner

Wie kann ich Umschalten ein element CSS-auf focus/blur mit jQuery?

$('.answerSpace').bind('blur', function(){
$('.normProf').toggleClass('opacProf');
});

$('.answerSpace').bind('focus', function(){
    $('.opacProf').toggleClass('normProf');
});

So, jetzt habe ich diese. Aber es funktioniert nicht ganz...

InformationsquelleAutor hubrid | 2011-04-09
  1. 11

    Versuchen

    $('.answerSpace').bind('blur', function(){ $('.normProf').removeClass("normProf").addClass('opacProf'); });
$('.answerSpace').bind('focus', function(){ $('.opacProf').removeClass("opacProf").addClass('normProf'); });
    • Solide. Süß es funktioniert perfekt. Dank einer Tonne.
    InformationsquelleAutor mattsven
  2. 18

    Überprüfen Sie dieses heraus, es ist genau wie y ' all tun sollten, jQuery Fokus Umschalten..

    Basic use case:

    JS:

    $('input').on('focus blur', toggleFocus);

function toggleFocus(e){
    console.log(e.type)

    if( e.type == 'focusin' ){ 
      //do something on focus
    }
    else{
      //do something else on blur
    }
}

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input>

    • Dies ist die eleganteste Lösung hier.
    InformationsquelleAutor vsync
  3. 7

    Gut, wenn ich dir Recht, die Sie verwenden können, onblur und onfocus Veranstaltungen, mit der toggleClass Funktion:

    $('#yourelement').bind('blur', function(){
    $(this).toggleClass('your-class');
});

$('#yourelement').bind('focus', function(){
    $(this).toggleClass('your-class');
});
    • Hmmm, wenn ich diese, die css-änderungen, die auf den ersten Schwerpunkt. Dann es nicht ändern, zurück auf die Unschärfe. Noch die zweite Unschärfe. Aber eigentlich schon auf die Dritte Unschärfe, es kehrt dann zu der früheren css-Dateien. Der code, den ich verwende, ist oben.
    • Sie könnte kombinieren die bind('blur focus')
    InformationsquelleAutor bluefoot
  4. 0

    Blur ist nur aktiv werden, wenn Sie von einer Eingabe, so können Sie es verwenden, um entfernen Sie den Fokus erneut ein.

    $('input').focus(function(){
    $(this).css('box-shadow', '0px 0px 1px #ccc');
});

$('input').blur(function(){ 
    $(this).css('box-shadow', 'none');
});
    InformationsquelleAutor TheCrazyProfessor
Schreibe einen Kommentar