【问题标题】:Cakephp- Jquery menubar changing URLCakephp-Jquery 菜单栏更改 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>

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

【问题讨论】:

    标签: jquery cakephp menubar


    【解决方案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 代码。
  • 猜你喜欢
    相关资源
    最近更新 更多
    热门标签