jQuery function preventing form from submitting

Question

I'm working on this site: http://dev.rjlacount.com/treinaAronson-test

The problem I'm having is with the contact form (click the contact button on the top left to slide it open).

I'm using the following jQuery to cause the contact form to slide closed on esc key press or clicking outside of the open panel:

$(document).bind({
    keydown:function(e) {
        if (e.keyCode == 27 ) {
            $("#panel").slideUp("3000");
            $("form#change-form-2")[0].reset();
            $('#fade , .popup_block').fadeOut(function() {
                $('#fade').remove();  //fade them both out
            });
        }
    }, click: function(e) {
        $("#panel").slideUp("3000");
    }
});
$('#flip, #panel').bind('click', function(e){return false});

This works for what I need it to do, but is disabling the functionality of my submit button. It is also (although this is a more minor issue) causing the panel to close if I right-click anywhere. I'm pretty new to Javascript; would anybody mind helping me prevent this from disabling the functionality of the contact button?

Any advice would be greatly appreciated!

Answer 1

To get the submit form to function normally, change "return false" to the following: this will allow the form to function normally without allowing the event to bubble to the document.

$('#flip, #panel').bind('click', function(e){
    e.stopPropagation();
});

Answer 2

您可以设置button的disabled属性：

$("yourButtonSelector").attr("disabled", "disabled");

Answer 3

What if you bind the click just to the #content div? Then there should not be any problems in your #contact div.