jquery - Duplicate javascripts are getting loaded ajax -

i'm developing web based document management final year project. user interacts 1 page , respective pages called using ajax when user click respective tabs (used tabs navigation).

due multiple user levels (admin, managers, etc.) i've put javascripts correspondent web pages.

when user requests user request everythings work except situations functions triggered multiple times. found problem. each time user clicks tab loads same scripts new instance , both of them triggered when call function.

to load content tired

.load , $.ajax(); non of them address issue.

i tried put main page @ time jqueryui not work. tired

$(document).load('click', $('#tab_root li'), function(){}); 

same issue remain.

can me out issue?

--edit--

    $(function){         $(document).on('click','#tabs',function(e){             getajax($(this))         });      }      //method load via ajax     function getajax(lst){         var cont = $(lst).text();         $.ajax({             url:'../mainpageajaxsupport',             data: {                 "cont":cont             },             error: function(request, status, error){                 if(status==404){                     $('#ajax_body').html("the requested page not found. please try again shortly");                       }             },             success: function(data){                 $('#ajax_body').html(data);             },          });       } 

you can't undo javascript after has been executed unloading file or removing script element.

the best solution set variable in each javascript file include in ajax data , include them online inline javascript inside ajax data along conditional such:

<script>     if(!tab1var) $.getscript("filename"); <script> 

older solutions

you can manually unbind each event before setting them off.

$(function){         $('#tabs').off('click');         $('#tabs').on('click',function(e){             getajax($(this));         }); } 

alternatively can initialize global variable (eventsbound1=false) each tab in main html:

$(function){     if(!eventsbound1){         $('#tabs').on('click', function(e){             getajax($(this));         });         eventsbound1 = true;     } } 

the tabs click event example have each time bind event in scripts being reloaded.

if events bound things inside ajax_body, final thing can try is:

success: function(data){     $('#ajax_body').empty();     $('#ajax_body').html(data); },