2013-10-24 45 views
0

我已经menuin WordPress的是这样的: -WordPress的:如何添加跨度菜单

<div id="my_custom_class"> 
<ul class="my_custom_class"> 
    <li class="page_item"><a href="#">page_item</a> 
<ul class='children'> 
    <li class="page_item child"><a href="#">children</a></li> 
</ul> 
    </li> 
    <li class="current_page_item"><a href="#">current_page</a></li> 
    <li class="current_page_item"><a href="#">current_page</a></li> 
    <li class="current_page_item"><a href="#">current_page</a></li> 
</ul> 
</div> 

这个菜单会创建wheni使用: -

<? wp_nav_menu('menu=header'); ?> 

,所以我需要在任何li有孩子,加上<span></span>标签befor标签这样

<div id="my_custom_class"> 
    <ul class="my_custom_class"> 
     <li class="page_item"><span></span><a href="#">page_item</a> 
    <ul class='sub-menu'> 
     <li class="page_item child"><a href="#">children</a></li> 
    </ul> 
     </li> 
     <li class="current_page_item"><a href="#">current_page</a></li> 
     <li class="current_page_item"><a href="#">current_page</a></li> 
     <li class="current_page_item"><a href="#">current_page</a></li> 
    </ul> 

</div> 

我怎么能做到这一点。通过jQuery

+0

你指仅限顶层列表项目? – Johan

+1

你可以尝试通过搞乱'wp_nav_menu_objects'钩子​​来实现这个服务器端 – Joren

+0

我会推荐你​​考虑一个服务器端解决方案@Joren建议。使用WordPress,修改特设的jQuery可能会导致意想不到的结果。 –

回答

1

使用.prepend()

$('ul.my_custom_class li a').closest('li').prepend('<span></span>'); 

Live DEMO

Live DEMO

$('ul.my_custom_class li:has(ul)').prepend('<span></span>'); 
0

如果你都不愿意掏WordPress的功能,你可以用正则表达式注入<span>元素:

(<li.*class="[^\"]*page_item[^\"]*"[^>]*>)(<a.*</a>[^<]+<ul)

结果:

<div id="my_custom_class"> 
<ul class="my_custom_class"> 
<li class="page_item"><span></span><a href="#">page_item</a> 
<ul class='children'> 
<li class="page_item child"><a href="#">children</a></li> 
</ul> 
</li> 
<li class="current_page_item"><a href="#">current_page</a></li> 
<li class="current_page_item"><a href="#">current_page</a></li> 
<li class="current_page_item"><a href="#">current_page</a></li> 
</ul> 
</div> 

$1 = <li class="page_item">

$2 = <a href="#">page_item</a><ul

所以你只是preg_replace\1<span></span>\2(您将需要一个反斜杠添加到</a>

Example on php fiddle(假设我正确生成链接笑)

相关问题