jQuery one event prevents other event from being fired -
i'm unsure overlooking. if design bad or if there smart way of solving this.
given: 1 input field 1 hidden button
logic: if input field focused, hidden button gets shown. if input field unfocused, button gets hidden. if button clicked, function called, , button gets hidden.
the problem when button clicked, input field gets unfocused before, unfocus listener fires first , somehow button-click listener never fires.
why this? why aren't both listeners triggered?
current code structure:
$(someinputfield).focus(function(){ show button } $(someinputfield).focusout(function(){ hide button } $(somebutton).click(function(){ deliver(); hide button }
deliver(); never gets executed!
edit: here real code:
$("#input1").focus(function(){ $("#submit1").delay(600).queue(function(next){ $(this).css('display', 'block'); next(); }); }); $("#input1").focusout(function(){ $("#submit1").hide(); }); $("#submit1").click(function(){ deliver(); settimeout(function(){ $(this).hide(); }, 2000); });
use input
instead of button
button.
that way input remain focus when click on button, not outside.
your selector
.focus()
event have include both input , it's button, in example below have selected inputs. need change this.
$(function(){ $('input').focus(function(){ $('.button').show(); }); $('input').blur(function(){ $('.button').hide(); }); $('.button').click(function(){ alert("clicked"); }); });
jsfiddle here http://jsfiddle.net/panomosh/2cjmggqe/2/
Comments
Post a Comment