[jQuery] event coordination problem

[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>