Hello,

When the JS file is not working at the time of Ajax files is called. on first time the onmouseover JS is working but , if you call the ajax JS is not working.

Why do this, when you can simply call the script via src? Anyway here's a little example that wil load .js files via AJAX request.
let's say you have this my.js file that contains a few lines of:

function test() {
return alert("I'm a function generated by an AJAX call!"); }

and here goes for the main page:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head id="header">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>AJAX External.js</title>
<script type="text/javascript">
// <![CDATA[
var ajax, xmlData; 
var handleRequest, myJS, $cript, head;

handleRequest = function() {
   if ( xmlData.readyState === 4 ) {
      if ( xmlData.status === 200 ) { 
myJS = xmlData.responseText;

      head = ( document.getElementById ) ? document.getElementById("header") : document.all.header;

      $cript = document.createElement("script");
      text = document.createTextNode("// <![CDATA[\n" + myJS + "// ]]>\n");
      $cript.type = "text/javascript";
      $cript.appendChild( text );
         { head.insertBefore(        $cript, document.getElementsByTagName("script")[0] ); 
         }
      } else { alert("Unable to process XML data!"); }
   }   
};

ajax = function ( url ) {
xmlData = null;
   if ( window.XMLHttpRequest ) {
   xmlData = new XMLHttpRequest();
   } else if ( window.ActiveXObject ) {
      try {
      xmlData = new ActiveXObject("Microsoft.XMLHTTP");
      } catch( e ) {
          xmlData = new ActiveXObject("Msxml2.XMLHTTP");
      }
   }
   if ( xmlData !== null ) {
   xmlData.onreadystatechange = handleRequest; 
   xmlData.open("GET", url, true);
   xmlData.send( null );
   } else {
     alert("\nYour browser does not support AJAX Request!"); 
   }
};
window.onload = ajax("my.js");
// ]]>
</script>

</head>
<body>
<div id="content">
<a href="javascript:test();">AJAX : Requested Function (CLICK ME!)</a>
</div>
</body>
</html>

Good day...

Thankyou ,

Thanks for ur info.... I using the following code to run js file while ajax file called...

function makeAjaxObj(){
var x;
var browser = navigator.appName;
//alert(browser);
if(browser == "Microsoft Internet Explorer"){
x = new ActiveXObject("Microsoft.XMLHTTP");
}else{
x = new XMLHttpRequest();
}
return x;
}

var ajaxreq = makeAjaxObj();  

function getoptioncat()
{


  var radio_choice = false;
    for (counter = 0;  counter <  document.optioncat.optiontype.length; counter++)
    {

        if ( document.optioncat.optiontype[counter].checked)
        {

             var val =  document.optioncat.optiontype[counter].value;

              ajaxreq.open('get', 'selectoption.php?optionid='+val);
              ajaxreq.onreadystatechange = SelectOptionReady;
              ajaxreq.send('');
              radio_choice = true; 

        }
    }
    if (!radio_choice)
    {
    alert("Choose Any One")
    return false;
    }
    return true;

}
function SelectOptionReady()
{
 if(ajaxreq.readyState < 4)
        {
        document.getElementById('optioncatdiv').innerHTML = "Please wait...<br><img src='images/load1.gif'/>";
        }
   if(ajaxreq.readyState == 4)
        {
            var answer = ajaxreq.responseText;
             document.getElementById('optioncatdiv').innerHTML = answer;
             document.getElementById("optioncatdiv").style.display='block';
             document.getElementById("catdiv").style.display='none';
             document.getElementById("country1").style.display='none';
             document.getElementById("country2").style.display='none';
                document.getElementById("country3").style.display='none';
                document.getElementById("country4").style.display='none';
                document.getElementById("country5").style.display='none';
                document.getElementById("country6").style.display='none';
                document.getElementById("viewoptioncatdiv").style.display='none';
             document.getElementById('Selsub_Subcatdiv').style.display='none';
             document.getElementById("subcatdiv").style.display='none';
             document.getElementById("lastcatdiv").style.display='none';
             document.getElementById("sub_Subcatdiv").style.display='none';

             $(".selectoptioncarouselDiv").jCarouselLite({
     btnPrev: ".prev",
     btnNext: ".next",
     circular: false,
     speed: 800,
     visible:3,
     scroll:1
   });

   $(".prev").mouseenter(function(){
         $(this).click();
      });

   $(".next").mouseenter(function(){
      $(this).click();
    });



        }
}

Edited 3 Years Ago by mike_2000_17: Fixed formatting

This question has already been answered. Start a new discussion instead.