当h：inputText在javascript中聚焦时，如何触发事件

Question

I am programming a Web-Application with Java EE and JSF.

I want to fire a function in javascript when h:inputText is focussed out. I tried something, but it does not work. What I did;

html;

<h:inputText id="devLati"
    class="ui-inputfield ui-inputtext ui-state-default ui-corner-all devInp"
    onmouseover="$(this).addClass('ui-state-hover')"
    onmouseout="$(this).removeClass('ui-state-hover')"
    onmousedown="$(this).addClass('ui-state-focus')"
    onmouseup="$(this).removeClass('ui-state-focus')"
    value="#{deviceRegionFacade.devLati}" />

js;

function initialize() {

...

$('#mainForm\\:devLati').focusout(function() {
    var newLat = $('#mainForm\\:devLati').val();
    var oldLat = marker.getPosition().lat();
    if(newLat != oldLat){
        removeMarker();
        var myLatLng = new google.maps.LatLng(newLat, marker.getPosition().lng());
        marker = new google.maps.Marker({
            map: map,
            position: myLatLng,
            icon : 'resources/images/maintenanceAndLifeTimePage/unknown.png'
        });
        marker.setAnimation(google.maps.Animation.BOUNCE);
    }

  });
}

• initialize() is called while opening the page.

Answer 1

Use blur event:

$('#devLati').on('blur', function() {
    // Event handling code
});

The blur event is sent to an element when it loses focus.

Docs: https://api.jquery.com/blur/

Answer 2

Try:

<h:inputText id="devLati"
class="ui-inputfield ui-inputtext ui-state-default ui-corner-all devInp"
onfocus="$(this).addClass('ui-state-focus')"
onblur="$(this).removeClass('ui-state-focus')"
value="#{deviceRegionFacade.devLati}"
/>