Cakephp-Jquery 菜单栏更改 URL

Posted 2023-02-16

【中文标题】Cakephp-Jquery 菜单栏更改 URL

【英文标题】：Cakephp- Jquery menubar changing URL

【发布时间】：2013-04-11 09:11:20

【问题描述】：

我正在尝试使用 Jquery 为 cakephp 网站创建菜单栏。 下面的代码显示了放置在视图文件夹中的 ctp 文件中的菜单元素。

           <div id="menubar" class="menu">
        <ul id="menu" class="menu">

             <li class="active">
           <a href="#tab4"><span>Allocation</span></a>
             </li>
            <li class=><a href="#tab1"><span>Update Travel</span></a></li>
            <li><a href="#tab2"><span>User Profile</span></a></li>
            <li><a href="#tab3"><span>Pay/Withdraw</span></a></li>

        </ul>
        <div class="clear"></div>
    </div>

我创建了一个 jquery 文件来选择每个菜单项并将这个文件放在 webroot/js 文件夹中

         (function($) 
 $.fn.extend(  
     tabify: function( callback ) 

        function getHref(el)
            hash = $(el).find('a').attr('href');
            hash = hash.substring(0,hash.length-4);
            return hash;
        



        function setActive(el)

            $(el).addClass('active');
            $(getHref(el)).show();
            $(el).siblings('li').each(function()
                $(this).removeClass('active');
                $(getHref(this)).hide();
            );
        

        return this.each(function() 

            var self = this;
            var callbackArguments   =   'ul':$(self);

            $(this).find('li a').each(function()
                $(this).attr('href',$(this).attr('href') + '-tab');
            );

            function handleHash()

                if(location.hash && $(self).find('a[href=' + location.hash + ']').length > 0)              
                    setActive($(self).find('a[href=' + location.hash + ']').parent());
                
            

            if(location.hash)
                handleHash();
            

            setInterval(handleHash,100);

            $(this).find('li').each(function()
                if($(this).hasClass('active'))
                    $(getHref(this)).show();
                 else 
                    $(getHref(this)).hide();
                
            );

            if(callback)
                callback(callbackArguments);
               

        ); 
     
); 
) (jQuery);

当我调用这个函数时，它会正常工作。

   $(document).ready(function () 
$('#menu').tabify();

     );

但我的问题是，当我在 #tab1、#tab2、#tab3、#tab4 的 ctp 文件中为每个菜单写入准确的 url 时，它将不起作用。

我想给这个网址

 <li class=><?php echo $this->html->link('<span>Commuter</span>', array('action' => '../userprofiles/commuter'), array('escape' => false)); ?></span></li>

插入

    <li><a href="#tab3"><span>Pay/Withdraw</span></a></li>

如果有人能解决这个问题，请帮助我

【参考方案1】：

链接的语法应该是数组的形式（请参阅HtmlHelper 的文档）。

<li class="">
    <?php echo $this->Html->link('<span>Commuter</span>', 
                                   array('controller'=>$your_controller_here,
                                         'action' => $your_action_here,
                                    $param1 /*parameters if you need them*/),
                               array('escape' => false)); ?>
</li>

根据您的需要更换控制器和操作等，看看是否可以解决问题。

请注意，没有必要以数组的形式传递 url，但您必须决定是使用数组还是静态字符串 url（如'../userprofiles/commuter'），不要同时使用。

【讨论】：

但实际上我的问题是，如果我在 标签内添加此链接，当我调用 jquery 时会有一些 url 哈希，我们如何管理 tha???/

我不知道您所说的“url 哈希”是什么意思。你能用firebug检查你用$this->Html->link得到的html吗？

当我调用这个函数时 $(document).ready(function () $('#menu').tabify(); );请查看我的 jquery 代码。