Firefox loading two elements with AJAX/JS

The issue is in any version of firefox, when I go click a link(that uses popUp();) it will load TWO ajax elements where it should load one. I have heard that it has something to do with function(){ } but i'm not sure and after about 3 hours of re/searching I have came across nothing.

            function popup(type,content,title,button,colID){
            if(type == 'text'){
                var newdiv = document.createElement('div');
                newdiv.setAttribute('id','Popup');
                newdiv.innerHTML = '<popupStrong>'+title+'</popupStrong><br /><div id="closePopup" onclick="this.parentNode.style.display=\'none\';">'+button+'</div>'+content;
             开发者_运维百科   document.body.appendChild(newdiv);
            } else {
                xmlhttp=GetXmlHttpObject();
                if (xmlhttp==null){
                    window.location='internetexplorer.php';
                }
                xmlhttp.onreadystatechange=function() {eval(contentPopup(title,button,colID));};
                xmlhttp.open("GET",content,true);
                xmlhttp.send(null);
            }
}
function contentPopup(title,button,colID){
    if(xmlhttp.responseText && xmlhttp.responseText != 'undefined'){
        var newdiv = document.createElement('div');
        newdiv.setAttribute('id','Popup');
    if(xmlhttp.responseText != 'error.php'){
         newdiv.innerHTML = '<popupStrong>'+title+'</popupStrong><br /><div id="closePopup" onclick="this.parentNode.style.display=\'none\';">'+button+'</div>'+xmlhttp.responseText;
    } else {
        newdiv.innerHTML = '<popupStrong>404</popupStrong><br /><div id="closePopup" onclick="this.parentNode.style.display=\'none\';">Close</div>The element you were trying to load doesn\'t exist.';
    }
        document.body.appendChild(newdiv);
    }
}

Change the code as like this.

function popup(type,content,title,button,colID){
        if(type == 'text'){
            var newdiv = document.createElement('div');
            newdiv.setAttribute('id','Popup');
            newdiv.innerHTML = '<popupStrong>'+title+'</popupStrong><br /><div id="closePopup" onclick="this.parentNode.style.display=\'none\';">'+button+'</div>'+content;
            document.body.appendChild(newdiv);
        } else {
            xmlhttp=GetXmlHttpObject();
            if (xmlhttp==null){
                window.location='internetexplorer.php';
            }

            xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4) {
                eval(contentPopup(title,button,colID));
          }};
            xmlhttp.open("GET",content,true);
            xmlhttp.send(null);  }}

In the Ajax request, ready state == 4 indicates the completion of response. Please refer the below link for your reference http://www.w3schools.com/ajax/ajax_xmlhttprequest_onreadystatechange.asp

Regards,

Kirubha

I described here (translated from romanian to english) why this is happening in jQuery: basically you will need to add the trailing slash to your url. So instead of having:

http://your.awesome.url?do=awesome.thing

you should have:

http://your.awesome.url/?do=awesome.thing