Question

I’ve got js script that load my Home messages, fans, etc. The problem is when i load any version of JQuery it is stacked on spinner image.
+webaddr+’/images/spinner.gif

Whenever i get read of the jquery it works fine.

As you see in the code bellow there are stab_ that load specific needs.

For example: hmhome load hm_home. etc

i also had to rewrite the code but didn’t help.

Any ideas?

// Load messages  
function showhome(tp,u,p,primsgtype){
    $("homecontainer").innerHTML='<img src="'+webaddr+'/images/spinner.gif">';
    var linum=$("primary_nav").getElementsByTagName("li").length;
    for (var i=0; i<linum; i++) {
        if ($("primary_nav").getElementsByTagName("li")[i].className=="current"){
            $("primary_nav").getElementsByTagName("li")[i].className="";
        }
    }
    $("stab_"+tp).className="loading";
    var request = YAHOO.util.Connect.asyncRequest('GET', webaddr+"/home/"+tp+"/u."+u+"/p."+p+"&pm="+primsgtype+"&rank="+GetRandomNum(1,999999), {
        success:function(o){
            $("homecontainer").innerHTML=o.responseText;
            $("stab_"+tp).className="current";
            YAHOO.util.Event.onContentReady("stream",function(){
                var el=YAHOO.util.Dom.get("stream");
                if(!el){return;}
                var _li=el.getElementsByTagName("li");
                YAHOO.util.Event.on(_li,"mouseover",function(e){
                    YAHOO.util.Dom.addClass(this,"light");
                    YAHOO.util.Dom.removeClass(this,"unlight");
                    });
                YAHOO.util.Event.on(_li,"mouseout",function(e){
                    YAHOO.util.Dom.addClass(this,"unlight");
                    YAHOO.util.Dom.removeClass(this,"light");
                });
            });
            if ($("homenum") && $("hmhome")) {
                $("homenum").innerHTML=$("hmhome").value;
            }
            if ($("favoritenum") && $("hmfavorite")) {
                $("favoritenum").innerHTML=$("hmfavorite").value;
            }           if ($("repadnum") && $("hmrepad")) {
                $("repadnum").innerHTML=$("hmrepad").value;
            }           if ($("noticenum") && $("hmnotice")) {
                $("noticenum").innerHTML=$("hmnotice").value;
            }           if ($("followlistnum") && $("hmfollowlist")) {
                $("followlistnum").innerHTML=$("hmfollowlist").value;
            }           if ($("fanlistnum") && $("hmfanlist")) {
                $("fanlistnum").innerHTML=$("hmfanlist").value;
            }           if ($("sharelistnum") && $("hmsharelist")) {
                $("sharelistnum").innerHTML=$("hmsharelist").value;
            }           if ($("youfollownum") && $("hmyoufollow")) {
                $("youfollownum").innerHTML=$("hmyoufollow").value;
            }           if ($("recordsnum") && $("hmrecords")) {
                $("recordsnum").innerHTML=$("hmrecords").value;
            }           if ($("usersaysnum") && $("hmuusersays")) {
                $("usersaysnum").innerHTML=$("hmusersays").value;
            }
            if ($("primsghead")) {
                $("info").style.display="none";
            } else {
                $("info").style.display="block";
            }
            if (tp=="privatemsg") {
                YAHOO.util.Event.on("pmcontentbox", "keyup", function(e) {
                    var pmlen=$('pmcontentbox').value.length;
                    $('pmnums').innerHTML=pmlen;
                    if (len>150) {
                        $('pmcontentbox').value=$('pmcontentbox').value.slice(0,150);
                    }
                });
            }
        },
        failure:function(o){}
    }); }

for the last time a tried jquery-1.7.1.min.js
i will be very thankful for any guidelines.

Answer 1

The code you have shown is making use of a $() function, presumably defined by some other library, that appears to be a shortcut to document.getElementById(). jQuery also defines a $() function by default, so then the code you’ve shown would call the jQuery $() instead of the correct one. Fortunately jQuery provides a way to remove this conflict. At the beginning of your script use:

jQuery.noConflict();

Then if you want to call jQuery you use jQuery() instead of $(). Or define an alias:

var j = jQuery.noConflict();
j("#something").hide();  // or whatever

More information with examples at the jQuery doco page for .noConflict().