Question

我正在与COdeigniter合作，我正在通过jQuery对主容器中的内容收费。我有很多页面，我认为这不是加载它的最佳方式：

jQuery代码：

$(function () {
     var home = '../Indoamericana/Administrar/callHome/';
     var info = '../Indoamericana/Intranet/information/';
     var control = '../Indoamericana/Intranet/index/Proceso/';
     var loadPage = function (page) {
         $(".page-content").load(page);
     };
     $("#start_page").click(function (event) {
         loadPage(home);
     });
     $("#informacion_general").click(function (event) {
         loadPage(info);
     });
     $("#gestion_directiva").click(function (event) {
         var process = 1;
         loadPage(control + process);
     });
         ...
 });

html代码：

<ul class="sub-menu">
    <li >
        <a href="javascript:;" id = "informacion_general"> Información General </a>
    </li>
    <li >
        <a href="javascript:;" id = "gestion_directiva"> Gestión Directiva </a>
    </li>
    <li >
        <a href="javascript:;" id = "gestion_calidad">Sistema Gestión de la Calidad</a>
    </li>
    ...
</ul>

我可以找到更好的解决方案吗？谢谢你的帮助。

Answer 1

使用data-*属性将目标网址添加到锚元素，然后为所有菜单锚元素编写点击处理程序，在其中根据data-target属性加载内容

尝试

<ul class="sub-menu">
    <li >
        <a href="#" class = "menu-item" data-target="../Indoamericana/Administrar/callHome/"> Información General </a>
    </li>
    <li >
        <a href="#" class = "menu-item" data-target="../Indoamericana/Intranet/information/"> Gestión Directiva </a>
    </li>
    <li >
        <a href="#" class = "menu-item" data-target="../Indoamericana/Intranet/index/Proceso/"> Sistema Gestión de la Calidad </a>
    </li>
    ...
</ul>

然后

$(function() {
    $(".sub-menu .menu-item").click(function(event) {
        $(".page-content").load($(this).data('target'));  
    });
});

jQuery通过一个类实现调用

1 个答案: