Question

我的编码wordpress循环菜单。可以替换JQ吗？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- 1st Loop -->
<li class="dropdown">
    <a data-toggle='dropdown' class='dropdown-toggle'  href='javascript:void(0);' >First Pages</a>
    <!-- Should be
    <a data-toggle="collapse" data-parent="#sidebar-nav" href="#collapse-firstpage">First Page</a>
    -->
    <ul class="dropdown-menu">
    <!-- Should be
    <ul id="collapse-firstpage" class="collapse">
    -->
        <li><a href="new-page-1">New Page 1</a></li>
        <li><a href="new-page-2">New Page 2</a></li>
    </ul>
</li>
<!-- End 1st Loop -->

on href记录标题（First Page to firstpage），在ul id之前和之后插入[＃collapse-]，就像href一样但没有[＃]。

Answer 1

使用每个循环

＆＃13;

jQuery(document).ready(function($){
$('.dropdown').each(function(){
var  $val = $(this).children('a').html();
var $page_name = $val.toLowerCase().replace(/[^a-z0-9\s]/gi, '').split(' ').join('');
$(this).children('a').replaceWith(' <a data-toggle="collapse" data-parent="#sidebar-nav" href="#collapse-'+$page_name+'">'+$val+'</a>');
$('.collapse', this).attr('id','collapse-'+$page_name);
})
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- 1st Loop -->
<li class="dropdown">
    <a data-toggle='dropdown' class='dropdown-toggle'  href='javascript:void(0);' >First Pages</a>
    <!-- Should be
    <a data-toggle="collapse" data-parent="#sidebar-nav" href="#collapse-firstpage">First Page</a>
    -->
    <ul class="collapse">
    <!-- Should be
    <ul id="collapse-firstpage" class="collapse">
    -->
        <li><a href="new-page-1">New Page 1</a></li>
        <li><a href="new-page-2">New Page 2</a></li>
    </ul>
</li>
<!-- End 1st Loop -->

＆＃13;

的jQuery

  jQuery(document).ready(function($){
$('.dropdown').each(function(){
var  $val = $(this).children('a').html();
var $page_name = $val.toLowerCase().replace(/[^a-z0-9\s]/gi, '').split(' ').join('');
$(this).children('a').replaceWith(' <a data-toggle="collapse" data-parent="#sidebar-nav" href="#collapse-'+$page_name+'">'+$val+'</a>');
$('.collapse', this).attr('id','collapse-'+$page_name);
})
 });

jquery自定义，自定义attr

1 个答案: