2009-07-03 3 views
6

Ich verwende das JQuery Treeview-Plugin, um einige Daten anzuzeigen. Grundsätzlich möchte ich dem Kind ein Klickereignis hinzufügen, das seinen inneren HTML-Code in ein anderes div auf der Seite kopiert. Ich konnte diesen < li> -Elementen jedoch kein Klickereignis zuweisen.Zuweisen von Klickereignissen zu < li > in JQuery Treeview

In der Hoffnung, dass jemand diesen Boden vorher betreten hat und Hilfe leisten kann.

Danke.

+0

Sie gerade versucht: (“ #nameOfLi "). click (function() {alert ('foo');}) ;? – Peter

+1

ja - Es scheint nicht den Klick selbst für mich zu befestigen. Derselbe Code wird ein Klick-Ereignis an Elemente irgendwo auf der Seite außerhalb der Baumansicht anhängen (offensichtlich). – WorkingWeb

+0

Können Sie ein Code-Snippet posten? – Peter

Antwort

6

Mit dem Markup aus dem Beispiel bei http://docs.jquery.com/Plugins/Treeview:

$("span.file, span.folder", "#example li") 
    .click(function() { alert($(this).text()); }); 

funktioniert. Wenn Sie den Klick auf die LI-Elemente selbst bearbeiten, werden die Zweigkontraktionen und -erweiterungen erfasst.

+1

Danke, Ihr Kommentar hat mir klar gemacht, dass es die Art und Weise ist, wie ich die Baumansicht (über JSON und das Hinzufügen von Zweigen) erstelle, die das Problem verursacht hat. Ich konnte mein Problem lösen, indem ich das Click-Ereignis direkt nach dem Hinzufügen der dynamisch generierten Zweige zuordnete. – WorkingWeb

6

Sie können .Live Konstruktion verwenden. Für mich funktioniert es:

$('li','ul#menu').live('click', function(){ 
    alert('Click event');  
}); 
0

wie Try this

$('li:not(:has(>ul))', 'ul#menu').live('click', function() {    
       alert($(this).text()); 
      }); 

es Click-Ereignis zu Blattknoten hinzufügen, werden nur (nicht Root-Knoten)

1
<li onclick="selectNode(event, this);" id="${node2.nodeId}" class="closed"> 
    <span class="folder"> ${node2.name} </span> 
</li> 




function selectNode(event, nodeHtmlEl) { 
    // IE 
    if ($.browser.msie) { 
     window.event.cancelBubble = true; 
    } 
    if(event.stopPropagation) { 
     event.stopPropagation(); 
    } 
    alert("selectNode ID: " + $(nodeHtmlEl).attr("id")); 
}