2010-11-24 2 views
0

Ich versuche, Prototyp zu Jquery von dem, was ich getan habe, zu konvertieren.Aktualisieren einer jquery mit dem Ajax-Post-Ergebnis

Mein Prototyp ist

$$(".user-link").each(function(el){ 
el.observe("mouseover", function(event) { 
    _selectedLinkEl = el; 
    _detailEl = event.element().next(); 
    _detailEl.show(); 
    _href=el.readAttribute('href').split("/")[2]; 

     new Ajax.Request('/users/user_detail/?name='+_href, { 
    onSuccess: function(transport) { 
     if (200 == transport.status) 
      _detailEl.update(transport.responseText); 
     } 
            }); 

    _body.observe("mouseover", _bodyMouseOverFunction); 
}); 
}); 

    var _bodyMouseOverFunction = function(event) { 
if(event.element() != _selectedLinkEl && 
     event.element() != _detailEl && 
     !event.element().ancestors().include(_detailEl)) { 
_detailEl.hide(); 
_body.stopObserving("mouseover", _bodyMouseOverFunction); 
    } 
}; 

Wie die oben jquery ändern?

Benutzer-Link ist ein Klassenname, der in vielen Links vorhanden ist. Ich versuche eine Ajax-Anfrage mit der Maus über diesen Link auszuführen.

EDIT:.

ich versucht habe, als jQuery (document) .ready (function() {

    jQuery(".user-link").hover(function() { 


         jQuery(this).next().show(); 
      var href=jQuery(this).attr("href"); 

      href= href.split("/")[2]; 

     jQuery.post('http://localhost:3000/users/user_detail/?name='+href, 
     function(data){ 
      alert("Data Loaded: " + data); 

      } 

      ); 


     }); //hover 
    });// doc ready 

ich die Warnung mit dem Ergebnis des Ajax-Request bekommen Wie zu aktualisieren einem Element mit dem Ergebnis, erhalten ??

+0

1. lernen jquery 2. lernen Prototyp 3. konvertieren – mkoryak

Antwort

1

Hoffentlich helfen Ihnen den Einstieg:

$(".user-link").mouseover(function(event) { 
    _selectedLinkEl = this; 
    _detailEl = event.target.next(); 
    _detailEl.show(); 
    _href=$(this).attr('href').split("/")[2]; 

    $.get('/users/user_detail/?name='+_href, 
     function(data, textStatus, xhr) { 
     if (200 == xhr.status) { 
      _detailEl.text(textStatus); 
     } 
     } 
    ); 

    $(_body).mouseover(_bodyMouseOverFunction); 
}); // user-link 

var _bodyMouseOverFunction = function(event) { 
    if(event.target != _selectedLinkEl && 
     event.target != _detailEl && 
     $.inArray(_detailEl, event.target.parents()) == -1) { 
     _detailEl.hide(); 
     $(_body).unbind("mouseover", _bodyMouseOverFunction); 
    } 
}; 
+0

Update funktioniert nicht .. – useranon

+0

Ich habe diese Linie verpasst. Ersetzt durch text(). –

+0

es zeigt einen Fehler als xhr nicht definiert .. – useranon

Verwandte Themen