form loaded in "lightbox" div with jquery will not submit with firefox but works in safari

Ok I created a lightbox that loads a form with Jquery. In Safari, Chrome everything works fine. In FireFOx the form will not submit. If I use event.preventDefault(); or if I use return false; when you click the submit button in FF nothing happens but as I said in Safari and Chrome all is good. Here is the Jquery code:

//LIGHTBOX FUNCTION

$(document).ready(function(){

 $('.litebox').click(function(e){

    e.preventDefault();

    var link = $(this).attr('href');

    if($('#lightbox_bg').length == 0开发者_如何学运维){

        $('body').append('<div id="loader"><img src="images/loader2.gif" /></div>');
        $('body').append('<div id="lightbox_bg"></div>');
        $('body').append('<div id="lightbox_content"></div>'); 

        $('#loader').css({"display":"block"});
        $('#lightbox_bg').fadeIn(300);
        $('#lightbox_content').load(link , function(){

            $(this).fadeIn(300);
            $('#loader').css({"display":"none"}).remove();
        });

        return false;
    } 
});


 $("#close-panel").live('click', function(e){ 

    e.preventDefault();

    $('#lightbox_content').fadeOut(300 , function(){
         $(this).remove();
    });

   $('#lightbox_bg').fadeOut(300, function(){
         $(this).remove();
    });



       return false;

}); 
});

Ideas? Firebug reports no errors. If I get rid of the eventDefault and the return false the form opens in its own page instead of in the lightbox DIV and then the submit button will submit the form. What am I missing. I'm new to this so please be kind.

thank you

EDIT

This is the form:

    <div class="grid_1_head"> Create Project <span class="right_shots"><a id="close-panel" href="#"class="create_new_shot">Close this window</a></span></div>
    <div class="hover_1_body"> 

        <p> Enter new project information below to create a new project </p>

        <div class="project_form_text">
        <div class="hover_1_error">           
    <div class="message_error"></div>
    <div class="project_create_success"></div>  

        </div>
            <div class="form_left">     
            <form id="create_project" action="widgets/create_project_process.php" method="post">  

<p>
         <label for="project_name">Project Name:</label>
         <input id="project_name" name="project_name" type="text" placeholder="required" class="field_boarder" value="" size="35px" maxlength="55px"  required/></br>

         <label for="project_description">Project Description:</label>
         <textarea id="project_description" name="project_description" rows="6" cols="36" placeholder="required" class="field_boarder"  maxlength="255px"  required></textarea></br>


         <label for="project_budget">Project Budget:</label>
            <input id="project_budget" name="project_budget" type="text" pattern="^\d+(?:,\d{3})*\.\d{2}$" placeholder="(optional, only if you want to track a budget)" class="field_boarder" value="" size="35px"  maxlength="55" /></br>

</div>



        <div class="login_button_container">
       <input name="create_project" type="submit" class="login_button" value="Create Project"/>



        </div>

    </form>

      </div> 

    </div>

My guess is it has something to do with the event.preventDefault but I can't tell without seeing the entire page. I'm assuming your .litebox div contains the form and any clicks within aren't acting normally. If this is the problem, you can solve it by using an on/off function for the preventDefault

change the line

 $('.litebox').click(function(e){

to

 function openLightbox(e){

don't forget to change the closing )}; to just }

Then, set it up like this:

$('.litebox').on('click', openLightbox);

and at the end of your openLightbox function, add the line

$(this).off('click', openLightbox);

if you have a function that closes the lightbox, put the line

$(this).on('click', openLightbox);

which will reactivate clicking the div .lightbox