Fancy Tree插件正在移除<a>-tags and IDs from my </a> <li> <a>-elements

时间:2015-10-08 12:37:51

标签: fancytree

edit: Somehow i have forgotten to say hi... Hi guys!

so far i've always found an answere to my questions because the question has already been asked and answered. But this time i searched for hours and still have no idea why my code is not working how it is supposed to do.

To my background: i am an apprentice in the 2nd year, so please don't be to hard on me :-)

I am using Fancytree-2.12.0, jQuery-UI-1.11.4 and jQuery-1.11.3.

Here is the HTML Markup:

<div id="CategorieTree">
    <ul id="treeData" style="display:none;">
        <li id="rootNode" class="expanded">
            <a href="loadPage.asp?Start=1"><strong>rootNode title</strong></a>
            <ul>
                <li id="100"><a href="loadPage.asp?Content=100">title 100</a></li>
                <li id="200"><a href="loadPage.asp?Content=200">title 200</a>
                    <ul>
                        <li id="210"><a href="loadPage.asp?Content=210">title 210</a>
                            <ul>
                                <li id="211"><a href="loadPage.asp?Content=211">title 211</a></li>
                                <li id="212"><a href="loadPage.asp?Content=212">title 212</a></li>
                            </ul>
                        </li>
                        <li id="220"><a href="loadPage.asp?Content=220">title 220</a></li>
                    </ul>
                </li>
                <li id="300"><a href="loadPage.asp?Content=300">title 300</a>
                    <ul>
                        <li id="310"><a href="loadPage.asp?Content=310">title 310</a></li>
                        <li id="320"><a href="loadPage.asp?Content=320">title 320</a>
                            <ul>
                                <li id="321"><a href="loadPage.asp?Content=321">title 321</a></li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

The Tree is displayed totally fine. But when i try to click an element and the links should reload the page with different content, nothing happens! When i open the dev-tools (i am using chrome Version 45.0.2454.101 m) i can see my original and another that is obviously created by FancyTree, but here all my IDs and the aTag-elments are removed like that:

<div id="CategorieTree">
    <ul class="ui-fancytree fancytree-container fancytree-plain">
        <li class="fancytree-lastsib">
            <span class="lots of classes">
                <span class="fancytree-expander"></span>
                <span class="fancytree-title"><strong>rootNode title</strong></span>
            </span>
            <ul>
                <li>
                    <span class="lots of classes">
                        <span class="fancytree-expander"></span>
                        <span class="fancytree-title">title 100</span>
                    </span>
                </li>
                <li>
                    <span class="lots of classes">
                        <span class="fancytree-expander"></span>
                        <span class="fancytree-title">title 200</span>
                    </span>
                    <ul>
                        <li>
                            <span class="lots of classes">
                                <span class="fancytree-expander"></span>
                                <span class="fancytree-title">title 210</span>
                            </span>
                            <ul>
                                <li>
                                    ....and so on
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

Here is my JavaScript for the initialization:

<script type="text/javascript">
  $("#CategorieTree").fancytree({
    activeVisible: true, // Make sure, active nodes are visible (expanded).
    aria: false, // Enable WAI-ARIA support.
    autoActivate: true, // Automatically activate a node when it is focused (using keys).
    autoCollapse: false, // Automatically collapse all siblings, when a node is expanded.
    autoScroll: false, // Automatically scroll nodes into visible area.
    clickFolderMode: 4, // 1:activate, 2:expand, 3:activate and expand, 4:activate (dblclick expands)
    checkbox: false, // Show checkboxes.
    debugLevel: 2, // 0:quiet, 1:normal, 2:debug
    disabled: false, // Disable control
    focusOnSelect: false, // Set focus when node is checked by a mouse click
    generateIds: false, // Generate id attributes like <span id='fancytree-id-KEY'>
      idPrefix: "ft_", // Used to generate node id´s like <span id='fancytree-id-<key>'>.
    icons: false, // Display node icons.
    keyboard: true, // Support keyboard navigation.
    keyPathSeparator: "/", // Used by node.getKeyPath() and tree.loadKeyPath().
    minExpandLevel: 1, // 1: root node is not collapsible
    quicksearch: false, // Navigate to next node by typing the first letters.
    selectMode: 2, // 1:single, 2:multi, 3:multi-hier
    tabbable: true, // Whole tree behaves as one single control
    titlesTabbable: false // Node titles can receive keyboard focus
  });
</script>

My Question is: Do aTags NEVER work when you initialize fancytree with pure HTML-Markup or did i just do something wrong?

Edit: I got my IDs!

generateIds: false;

had to be set to true.

Edit 2: I have not found a solution for my a-Tag problem. They still get removed when i initialize my tree with plain HTML-markup. Thus i have rewritten my code and now i initialize the tree by using the source-attribute.

0 个答案:

没有答案