jQuery选项卡使用ajax问题

This is the button type.

<input type="button" name="add_person_to_notify" value="Submit" id="add_person_to_notify">

this is the script code.

   <script type="text/javascript">
   $(function(){
           $("#dialog_person_to_notify_form").dialog({
                modal: true,
                width: 'auto',
                autoOpen: false
            });
          $("#add").click(function(){
                $("#dialog_person_to_notify_form").dialog("open");                                     
          });

         $("#add_person_to_notify").click(function(){

                var data = $('#form_person_to_notify').serialize(); 
                $.post('<?php echo base_url_l(); ?>hr/recruitment_tab/recruitment/person_to_notify_process',data,function(){
                    alert("Person to notify has been added!");  
                    $("#dialog_person_to_notify_form").dialog("close");
                    $('#applicant-view-form-tabs').tabs('load',0);
                }); 
         });                
  });
  </script>

Now i figured out the problem. once the tab is reloaded, the function happens twice. if the tab is reloaded for the third time. the functions happen three times and so on and so fort. can anyone help me what's the problem? I'm using AJAX for tabs.

Here is how i use the tabs.

    <div class="wrapper-maint">
    <div id="applicant-view-form-tabs" class="main-tab">
        <ul>
            <li><a href="<?= base_url_l() ?>tab1">Budget Management</a></li>
            <li><a href="<?= base_url_l() ?>tab2">Transactions</a></li>
            <li><a href="<?= base_url_l() ?>tab3">Reports</a></li>        
            </ul>
        </div>
</div>
<script type="text/javascript">
$(function(){
    $('#tabs-finance').tabs({

    });
});
</script>

Is there anything i should do with my tabs?

I don't see the full picture here but sounds like you need to use unbind:

$("#add_person_to_notify").unbind('click').click(function(){
 // ...
});