0

sample.htmlファイル内に次のような HTML コードがあります。

<ul id='topics' class='filetree'>
<li><span class='folder'><a href='?Lang=en&TopicID=#'>Topics</a></span>
<ul>
<li><span class='folder'><a href='?Lang=en&TopicID=1'>Topic 1</a></span>
<ul>
<li><span class='file'><a href='?Lang=en&TopicID=1.1'>Topic 1.1</a></span></li>
<li><span class='file'><a href='?Lang=en&TopicID=1.2'>Topic 1.2</a></span></li>
<li><span class='file'><a href='?Lang=en&TopicID=1.3'>Topic 1.3</a></span></li>
</ul>
</li>

JQuery.loadを使用して、Treeview を生成するために html ファイルをロードします

<div id="LtrLeftContent">
     <script language="javascript" type="text/javascript">
         $('#LtrLeftContent').load('sample.html', function () {
                $("#topics").treeview();
         });
     </script>
</div>

1 番目の質問:現在のノード テキストを調べる方法。ツリーノードをクリックしたとき？
2 番目の質問:親 + 現在のノード テキストを見つける方法。ツリーノードをクリックしたとき？
3問目：ノードにCSSを設定する方法。ツリー ノードをクリックすると?

いくつか試した後、現在の要素を取得します 

$("li span").click(function () {
    alert($(this).text());
});

以下のような完全なコード

<div id="LtrLeftContent">
        <script language="javascript" type="text/javascript">  
            $('#LtrLeftContent').load('sample.html', function () {  
                $("#topics").treeview();  
                $("li span").click(function () {  
                    alert($(this).text());  
                });  
            });                 
        </script>  
</div>
4

1 に答える 1

0 
$('a').live('click', function (e) {
    e.preventDefault();
    console.log($(e.currentTarget).text());
    console.log($(e.currentTarget).closest('.folder').text());

    // didn't quite get your last question
    // but this is how you would manipulate 
    // the current elements parent list item
    $(e.currentTarget).parents('li').css({
        'background-color': '#000'
    });
    return false;
});
于 2012-07-12T11:13:35.793 に答える