Jquery Treeview展开和折叠节点文本点击持续cookie选项

我想展开和折叠节点，当我点击+/- 符号，还有当我点击每个符号旁边的文本（超链接）。我想要折叠前一个节点并展开我单击的节点。我正在使用以下方法。Jquery Treeview展开和折叠节点文本点击持续cookie选项

$(document).ready(function(){ 

    // first example 
    $("#navigation").treeview({ 
     persist: "cookie", //I want to store the state and come back to the state when i reload the page. 
     collapsed: true, //I want to collapse all the nodes when i load. 
     unique:true //I want to open only one node at a time 
    }); 
});

我已经尝试了很多选择，但都没有工作。请帮帮我。

我的HTML是：

<ul id="navigation" class="treeview"> 
      <li> 
       <div> 
        <a href="#">Marketing</a> 
       </div> 
       <ul> 
        <li> 
         <div> 
          <a href="#">Joysticks</a> 
         </div> 
         <ul> 
          <li> 
           <div> 
            <a href="#">Intel</a> 
           </div> 
          </li> 
          <li> 
           <div> 
            <a href="#">Microsoft</a> 
           </div> 
          </li> 
          <li> 
           <div> 
            <a href="#">Sony</a> 
           </div> 
          </li> 
         </ul> 
        </li> 
        <li> 
         <div> 
          <a href="#">Laptops</a> 
         </div> 
         <ul> 
          <li> 
           <div> 
            <a href="#">Apple</a> 
           </div> 
           <ul> 
            <li> 
             <div> 
              <a href="#">iMac</a> 
             </div> 
            </li> 
            <li> 
             <div> 
              <a href="#">MacBook Air</a> 
             </div> 
            </li> 
            <li> 
             <div> 
              <a href="#">MacBook Pro</a> 
             </div> 
            </li> 
            <li> 
             <div> 
              <a href="#">Accessories</a> 
             </div> 
            </li> 
           </ul> 
          </li> 
          <li> 
           <div> 
            <a href="#">Dell</a> 
           </div> 
           <ul> 
            <li> 
             <div> 
              <a href="#">Inspiron</a> 
             </div> 
            </li> 
            <li> 
             <div> 
              <a href="#">XPS</a> 
             </div> 
            </li> 
           </ul> 
          </li> 
          <li> 
           <div> 
            <a href="#">Sony</a> 
           </div> 
          </li> 
         </ul> 
        </li> 
        <li> 
         <div> 
          <a href="#">Phones</a> 
         </div> 
         <ul> 
          <li> 
           <div> 
            <a href="#">LG</a> 
           </div> 
          </li> 
          <li> 
           <div> 
            <a href="#">Motorola</a> 
           </div> 
          </li> 
          <li> 
           <div> 
            <a href="#">Samsung</a> 
           </div> 
          </li> 
         </ul> 
        </li> 
       </ul> 
      </li> 
     </ul>

来源

2012-06-05 Surendra Chatakondu

请为'＃navigation'包含html。理想情况下，这将是实际html的精简版;只是需要了解整体结构的部分。 – lbstr

顺便说一下，它在treeview github页面上说：'请注意，这个项目不再被主动维护。查看jqTree获取更新的插件.'这是[jqTree]（http://mbraak.github.com/jqTree/）。 – lbstr

添加了html代码供您查看。这是由类后面的代码生成的代码。此代码不是硬编码的。 –

你后面的代码生成<div><a href="#">Marketing</a></div>。显然，有两层标签是有问题的。将结构更改为<span>Marketing</span>，它将起作用。我的猜测是，如果你愿意，你可以使用<a>或<div>。

我在这里做出这些变化和它的作品： http://jsfiddle.net/lbstr/V7A6A/2/

来源

2012-06-05 21:18:52 lbstr

即使我使用span标签更改锚标签，它也不会工作。同样的行为。 –

Jquery Treeview示例3也无法正常工作，因为我用span标记html替换了它们的html。 –

@SurendraChatakondu +/-符号在哪里？他们是'div'标签的背景图片吗？你能为这些显示CSS吗？ – lbstr

jQuery的树形例子是设置cookie，当我展开每个节点。我在每个站点/页面的后面代码中构建了相同的逻辑（如何在单击每个节点时使用它生成id），然后在生成标记时将此id分配给a标记。然后在document.ready函数中，我编写了以下逻辑以在每次单击时设置Cookie ID。

  jQuery.fn.alertElementUrl = function() 
      { 
       return this.each(function() 
       { 
        if(this.id == "") 
        { 
         $.cookie("treeview", $.cookie("treeview"),{path: '/'}); 
         window.location = this.href; 
        } 
        else 
        { 
         $.cookie("treeview", this.id.substring(this.id.lastIndexOf('_')+1),{path: '/'}); 
         window.location = this.href; 
        } 
       });  
      }; 

      $("a").click(function() 
      { 
       $(this).alertElementUrl();  

      });

来源

2012-06-12 19:32:11

Jquery Treeview展开和折叠节点文本点击持续cookie选项

回答

相关问题