I pasted your code into a new HTML doc and it ran as expected: if you put the focus in the textbox (#id1) then click the button (#id2) both events get fired (blur event fires first, click event fires second).
Is there anything else in your page? Are you getting any JS errors? On Sep 13, 4:27 am, jhm <jmay...@gmail.com> wrote: > Not sure how this helps, and in fact I'm pretty much already doing > that. The problem is that if the focus is in the field, when the > button is clicked I get the blur event only and not the click event on > the button. > > If you try the code in the OP, you'll see this happening. Remember to > click into the text box before clicking on the button. > > I need the click event for sure. I could live without the blur event > in this situation, but I'd also like to understand the dynamics of > what is happening for the future. > > Jim > > On Sep 12, 10:39 am, "Rick Faircloth" <r...@whitestonemedia.com> > wrote: > > > How about setting the field to "invalid" to start with and > > force the user to blur the field for a validation routine > > to declare it valid. > > > Rick > > > -----Original Message----- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of jhm > > Sent: Saturday, September 12, 2009 1:04 PM > > To: jQuery (English) > > Subject: [jQuery] event coordination problem > > > Hi- > > > In a form, I'm trying to validate a field when they move off it. But > > this causes a problem when the field has the focus and they click a > > button to process the form. In this case, only the field's blur event > > (or change event) gets fired and nothing for the button click event. > > > Seems like a reasonable thing to want to do, so I figure I'm missing > > something in they way I've coded this. Any suggestions? > > > Here's the very simple code that exhibits the behavior: > > > <head> > > <script type="text/javascript" src="./js/jquery.js"></script> > > <script type="text/javascript"> > > > $(document).ready( function() { > > $('#id1').blur( function() { > > alert('blur in id1'); > > }); > > > $('#id2').click( function() { > > alert('click in id2'); > > }); > > }); > > </script> > > </head> > > > <body> > > </body> > > <input type="text" value="Sample Text" name="id1" id="id1" /> > > <input type="button" name="Finish" value="Finish" id="id2" /> > > </html> > >
