Sharepoint2013 webpart 使用Jquery+json数据实现的菜单。

把代码块1 复制到txt 里单击后缀名字为js  such as xxx.js.  把此文件上传的文档库。右键--文件完全URL


在Sharepoint2013 里创建 一个webart 内容编辑器--编辑webpart --在content Link--单击浏览 把上面的URL复制进去。

js文件和样式文件需要去网上下载一下。 

<script src="../lib/jquery.js" type="text/javascript"></script>
 <script src="../lib/jquery.cookie.js" type="text/javascript"></script>
 <script src="../jquery.treeview.js" type="text/javascript"></script>

 <script type="text/javascript">

$(document).ready(function(){
 
 $("#navigation").treeview({
  persist: "location",
  collapsed: true,
  unique: true
 });

});

</script>



 <ul id="navigation">
  <li><a href="?1">Item 1</a>
   <ul>
    <li><a href="?1.0">Item 1.0</a>
     <ul>
      <li><a href="?1.0.0">Item 1.0.0</a></li>
     </ul>
    </li>
    <li><a href="?1.1">Item 1.1</a></li>
    <li><a href="?1.2">Item 1.2</a>
     <ul>
      <li><a href="?1.2.0">Item 1.2.0</a>
      <ul>
       <li><a href="?1.2.0.0">Item 1.2.0.0</a></li>
       <li><a href="?1.2.0.1">Item 1.2.0.1</a></li>
       <li><a href="?1.2.0.2">Item 1.2.0.2</a></li>
      </ul>
     </li>
      <li><a href="?1.2.1">Item 1.2.1</a>
      <ul>
       <li><a href="?1.2.1.0">Item 1.2.1.0</a></li>
      </ul>
     </li>
      <li><a href="?1.2.2">Item 1.2.2</a>
      <ul>
       <li><a href="?1.2.2.0">Item 1.2.2.0</a></li>
       <li><a href="?1.2.2.1">Item 1.2.2.1</a></li>
       <li><a href="?1.2.2.2">Item 1.2.2.2</a></li>
      </ul>
     </li>
     </ul>
    </li>
   </ul>
  </li>
  <li><a href="?2">Item 2</a>
   <ul>
    <li><span>Item 2.0</span>
     <ul>
      <li><a href="?2.0.0">Item 2.0.0</a>
      <ul>
       <li><a href="?2.0.0.0">Item 2.0.0.0</a></li>
       <li><a href="?2.0.0.1">Item 2.0.0.1</a></li>
      </ul>
     </li>
     </ul>
    </li>
    <li><a href="?2.1">Item 2.1</a>
     <ul>
      <li><a href="?2.1.0">Item 2.1.0</a>
      <ul>
       <li><a href="?2.1.0.0">Item 2.1.0.0</a></li>
      </ul>
     </li>
      <li><a href="?2.1.1">Item 2.1.1</a>
      <ul>
       <li><a href="?2.1.1.0abc">Item 2.1.1.0</a></li>
       <li><a href="?2.1.1.1">Item 2.1.1.1</a></li>
       <li><a href="?2.1.1.2">Item 2.1.1.2</a></li>
      </ul>
     </li>
      <li><a href="?2.1.2">Item 2.1.2</a>
      <ul>
       <li><a href="?2.1.2.0">Item 2.1.2.0</a></li>
       <li><a href="?2.1.2.1">Item 2.1.2.1</a></li>
       <li><a href="?2.1.2.2">Item 2.1.2.2</a></li>
      </ul>
     </li>
     </ul>
    </li>
   </ul>
  </li>
  <li><a href="?3">Item 3</a>
   <ul>
    <li class="open"><a href="?3.0">Item 3.0</a>
     <ul>
      <li><a href="?3.0.0">Item 3.0.0</a></li>
      <li><a href="?3.0.1">Item 3.0.1</a>
       <ul>
        <li><a href="?3.0.1.0">Item 3.0.1.0</a></li>
        <li><a href="?3.0.1.1">Item 3.0.1.1</a></li>
       </ul>
      </li>
      <li><a href="?3.0.2">Item 3.0.2</a>
       <ul>
        <li><a href="?3.0.2.0">Item 3.0.2.0</a></li>
        <li><a href="?3.0.2.1">Item 3.0.2.1</a></li>
        <li><a href="?3.0.2.2">Item 3.0.2.2</a></li>
       </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值