jQuery Mobile Auswahlmenü Fokus und Blur-Ereignis wird nicht ausgelöst

Ich versuche, eine Fußzeile zu verbergen, wenn ein Formularelement Fokus gegeben wird. Ich möchte auch eine Fußzeile anzeigen, wenn ein Formularelement den Fokus verliert, den das Blur-Ereignis behandeln sollte. Ich kann das Fokus- oder Unschärfereignis nicht auf einem jQuery Mobile-Auswahlmenü-Formularelement auslösen.jQuery Mobile Auswahlmenü Fokus und Blur-Ereignis wird nicht ausgelöst

Hier ist ein Beispiel von einem meines Formelement ist -

<select id="radiology-study-provider" class="selectList"></select>

Hier ist der jQuery-Code, der meine Fußzeile auf Fokus sollte und es auf Unschärfe zeigen verstecken (es ist im Inneren DOM bereit) -

Es ist seltsam, dass der Change Event Handler ausgelöst wird, aber Fokus und Blur nicht.

Ich habe dies unten versucht, und es wird nicht funktionieren -

$('.selectList').on('focus', function(){ 
     $('div:jqmData(role="footer")').hide(); // hide the footer 
    }); 
    $('.selectList').on('blur', function(){ 
     $('div:jqmData(role="footer")').show(); // show the footer 
    });

Ich habe auch versucht, diese -

$('.selectList').bind("focus", function(event, ui) { 
     $('div:jqmData(role="footer")').hide(); // hide the footer 
    }); 
    $('.selectList').bind("blur", function(event, ui) { 
     $('div:jqmData(role="footer")').hide(); // hide the footer 
    });

Ich habe auch versucht die focusin() und focusout() Ereignisse ohne Glück entweder. Ich habe Dutzende von Selektoren ausprobiert (div.ui-select war einer von ihnen). Ich denke nicht, dass es ein Problem mit dem Selektor ist, den ich verwende.

Ich benutze jQuery Mobile 1.1.0 und jQuery 1.7.1 - Ich habe die jQuery Mobile selectmenu Dokumentation unter http://jquerymobile.com/test/docs/forms/selects/events.html überprüft, sprach mit dem Google, suchte hier und kann dieses Problem nicht finden.

Quelle

2012-09-21 Ross

Hey Kumpel, funktioniert Ihre Change-Methode '$ ('. SelectList'). – Littm

Ja, das Änderungsereignis wird ausgelöst. – Ross

Das ist, was am Ende für mich funktionierte.

document.addEventListener("deviceready", onDeviceReady, false); 

function onDeviceReady() { 
    document.addEventListener("hidekeyboard", onKeyboardHide, false); 
    document.addEventListener("showkeyboard", onKeyboardShow, false); 

} 

function onKeyboardHide() { 
    $('div:jqmData(role="footer")').show(); // show the footer 
} 

function onKeyboardShow() { 
    $('div:jqmData(role="footer")').hide(); // hide the footer 
}

stieß ich auf das hier auf dem Stapel - Show hide keyboard is not working propery in android phonegap und bemerkte, gibt es diese zwei Ereignisse, die Sie für hören können.

Quelle

2012-09-21 17:16:27 Ross

Versuchen Sie, den Fokus Ereignis zu kommentieren und versuchen .. Manchmal, wenn der Fokus-Ereignis ausgelöst es mehrmals gebrannt wird, weil von denen Sie ... den Code nicht sehen, die ausgeführt wird

$('.selectList').change(function(){ 
     alert("the change event is firing"); 
    }); 

// $('.selectList').focus(function(){ 
// $('div:jqmData(role="footer")').hide(); // hide the footer 
// alert("Focus event is firing"); 
// }); 

    $('.selectList').blur(function(){ 
     //$('div:jqmData(role="footer")').show(); // show the footer 
     alert("Blur event is firing"); 
    });

I kommentiert aus der Fokus-Ereignis und die beiden anderen Ereignisse auszulösen scheinen .. die Kommentare entfernen und Sie sehen den Fokus Ereignis mehrmals ..

prüfen FIDDLE

Quelle

2012-09-21 06:01:21

Vielen Dank für Ihren Vorschlag. Leider wird das Blur-Event nicht ausgelöst. Ich muss irgendwie wissen, wenn die Android-Tastatur vorhanden ist, und dies ist durch die Fokus- und Unschärfe-Event-Handler auf Formularelementen möglich. – Ross

Dieser arbeitete für mich mit dem folgenden e bekommen gefeuert xample:

JS:

<script> 
    document.addEventListener("deviceready", function(){}, false); 

    $(function() { 
     $('.selectList').change(function(){ 
      console.log("the change event is firing");          
     }); 

     $('.selectList').focus(function(){ 
      console.log("FOCUS"); 
      $('#my_footer').hide(); // hide the footer 
     }); 

     $('.selectList').focusout(function(){ 
      console.log("FOCUS OUT"); 
      $('#my_footer').show(); // show the footer 
     }); 
    }); 
</script>

wo #my_footer die ID meiner Fußzeile ist (überprüfen Sie die HTML unten).

HTML:

<body> 
    <div data-role="page"> 
     <div data-role="content"> 

      <select id="radiology-study-provider" class="selectList"> 
       <option value="1">A</option> 
       <option value="2">B</option> 
       <option value="3">C</option> 
      </select> 

     </div> 
    </div> 
</body>

Sie können bei diesem Beispiel versuchen und sehen, ob das funktioniert für Sie paaren: S

Hoffnung, das hilft. Lassen Sie mich Ihre Ergebnisse wissen.

Quelle

2012-09-21 07:48:12 Littm

Vielen Dank für Ihre Hilfe. Wieder einmal wollte nur das Change Event feuern. Ich habe jedoch eine Lösung gefunden, ich werde posten, was für mich funktioniert hat. – Ross

Ihr Willkommen Kumpel :). Ich bin gespannt, was das Problem ist: S ... Ich werde auf Ihre Lösung warten: P – Littm

Ich muss noch 5 Stunden warten, um mich selbst zu beantworten, weil ich weniger als 10 Ruf habe. Ich werde es morgen hier veröffentlichen. Danke nochmal. – Ross

jQuery Mobile Auswahlmenü Fokus und Blur-Ereignis wird nicht ausgelöst

Antwort

Verwandte Themen