开发者

Jquery - call function when blur+clicking certain element?

开发者 https://www.devze.com 2023-01-23 00:08 出处:网络
I want to call a function when a certain field gets blurred, but only if a certain element is clicked. I tried

I want to call a function when a certain field gets blurred, but only if a certain element is clicked. I tried

$('form').click(function() {
    $('.field').blur(funct开发者_JAVA技巧ion() {
        //stuff
    });
});

and

$('.field').blur(function() {
    $('form').click(function() {
        //stuff
    });
});

But neither works, I reckon it's because the events happen simultaneously?


HTML

<form>
    <input class="field" type="textarea" />
    <input class="field" type="textarea" />
</form>
<div class="click-me-class" id="click-me">Click Me</div>
<div class="click-me-class">Click Me Class</div>

jQuery

$('.field').blur(function() {
    $('#click-me').click(function(e) {
        foo = $(this).data('events').click;
        if(foo.length <= 1) {
            // Place code here
            console.log("Hello");
        }
        $(this).unbind(e);
    });
});

You can test it out here: http://jsfiddle.net/WfPEW/7/


In most browsers, you can use document.activeElement to achieve this:

$('.field').blur(function(){
    if ($(document.activeElement).closest('form').length) {
        // an element in your form now has focus
    }
});


I have edited my answer because we have to take into account that the event is asigned every time.

It is not 100% satisfactory, and I don't recommend this kind of complicated way of doing things, but it is the more approximate.

You have to use a global variable to take into account the fact that the field was blurred. In the window event, it is automatically reset to 0, but if the click on "click-me" is produced, it is verified before the window event, becase window event is bubbled later, it happens inmediately after the "click-me" click event

Working code

$(window).click(function(e)
                {
  $("#result").html($("#result").html()+" isBlurred=0<br/>");
                        isBlurred=0;
                });

var isBlurred=0;

$('.field').blur(function() {
      $("#result").html($("#result").html()+" isBlurred=1<br/>");
    isBlurred=1;
});

    $('#click-me').click(function(e) {                  
        if(isBlurred==1)
        {
            $("#result").html($("#result").html()+" clicked<br/>");
        }

    });

".field" would be the input and "#click-me" would be the element clicked only just once.

0

精彩评论

暂无评论...
验证码 换一张
取 消