关于 Solo 前端页面的小问题

本贴最后更新于 2853 天前,其中的信息可能已经时移世易

1. 关于后台管理页面中 tabsPannel 标签下的问题

1. 代码背景
Solo 前端源码中后台管理里面统一是以 admin-index.ftl 为主页面,而其他功能(文章、用户)则分开放在其他 flt 文件中,通过异步来加载其他功能页面

2. 我们先简单回顾下代码的思路
整体设计如下 : (帮助您回想下,嘿嘿)

<div id="tabsPanel">
  <div id="tabsPanel_main" class="none">
  <div id="tabsPanel_article" class="none">
  <div id="tabsPanel_article-list" class="none">
  <div id="tabsPanel_draft-list" class="none">
  <div id="tabsPanel_link-list" class="none">
  <div id="tabsPanel_preference" class="none">
  <div id="tabsPanel_page-list" class="none">
  <div id="tabsPanel_others" class="none">
  <div id="tabsPanel_user-list" class="none">
  <div id="tabsPanel_comment-list" class="none">
  <div id="tabsPanel_plugin-list" class="none">
  <div id="tabsPanel_about" class="none">

然后我们通过调用 Jquery 的 load 方法来加载上面的子模块页面:比如加载 admin-user-list.ftl 页面

$("#tabsPanel_" + tab).load("admin-" + tab + ".do", function () {
    // 页面加载完后,回调初始函数
  if (tab === "article" && admin.article.status.id) {
        // 当文章页面编辑器未初始化时,调用更新文章需先初始化编辑器
  admin.register[tab].init.call(admin.register[tab].obj, admin.article.getAndSet);
  } else {
        admin.register[tab].init.call(admin.register[tab].obj, tags.page);
  }

    // 页面包含子 tab,需根据 hash 定位到相应的 tab
  if (subTab) {
        $("#tab" + tab.substring(0, 1).toUpperCase() + tab.substring(1)).
                tabs("setCurrent", subTab);
  }

    // 根据 hash 调用现有的插件函数
  admin.plugin.setCurByHash(tags);
});

最后 load 方法会把服务器中得到的数据插入到 id 为 tabsPanel_user-list 的 div 标签下。

3. 那么问题是
为什么 load 方法加载完页面后, <div id="tabsPanel_user-list" class="none"> 的属性会从 display:none 变成 display: block,如果自己在加一个新的 div 标签 <div id="tabsPanel_user-new" class="none"> 即使在 load 完页面后,属性依旧是 display:none

2. admin.min.js 的问题确认(续 Github 上的提问

管理后台依赖的 JS 压缩合并 —— 意思就是:把那些的依赖的 js 压缩成一个 min js 文件的意思吗?

@Vanessa

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • tianxin
    作者

    原来控制 属性 display 的 none 和 block 是 tabs 方法来控制的。已经解决该问题了。

    1. tabs 方法是在 jquery.bowknot.min.js 里实现的。jquery.bowknot.min.js 库的主要用途是干什么呢?
    1 回复
  • 其他回帖
  • tianxin
    作者

    @Vanessa 这样能 @ 到吗~

  • 1.3 . 你后台的 .do 请求要返回正常才会回调 function 里面的方法去设置 tab. 你先查看一下 admin-user-new.do 请求是否正常,js 里面的 $("#tabs").tabs("setCurrent", tab); 方法是否调用正常

    2 . 嗯,减少请求数

    BTW: at 前后需要加空格。

    1 回复
  • 收到了。稍等一下下

  • 查看全部回帖
tianxin
不会前端的后台工程师不是一个好厨师。所以,我的理想是成为一个吃遍天下美食的好厨师。 广州

推荐标签 标签

  • Tomcat

    Tomcat 最早是由 Sun Microsystems 开发的一个 Servlet 容器,在 1999 年被捐献给 ASF(Apache Software Foundation),隶属于 Jakarta 项目,现在已经独立为一个顶级项目。Tomcat 主要实现了 JavaEE 中的 Servlet、JSP 规范,同时也提供 HTTP 服务,是市场上非常流行的 Java Web 容器。

    162 引用 • 529 回帖 • 4 关注
  • OpenShift

    红帽提供的 PaaS 云,支持多种编程语言,为开发人员提供了更为灵活的框架、存储选择。

    14 引用 • 20 回帖 • 632 关注
  • Solo

    Solo 是一款小而美的开源博客系统,专为程序员设计。Solo 有着非常活跃的社区,可将文章作为帖子推送到社区,来自社区的回帖将作为博客评论进行联动(具体细节请浏览 B3log 构思 - 分布式社区网络)。

    这是一种全新的网络社区体验,让热爱记录和分享的你不再感到孤单!

    1435 引用 • 10056 回帖 • 489 关注
  • GAE

    Google App Engine(GAE)是 Google 管理的数据中心中用于 WEB 应用程序的开发和托管的平台。2008 年 4 月 发布第一个测试版本。目前支持 Python、Java 和 Go 开发部署。全球已有数十万的开发者在其上开发了众多的应用。

    14 引用 • 42 回帖 • 780 关注
  • wolai

    我来 wolai:不仅仅是未来的云端笔记!

    2 引用 • 14 回帖
  • CSDN

    CSDN (Chinese Software Developer Network) 创立于 1999 年,是中国的 IT 社区和服务平台,为中国的软件开发者和 IT 从业者提供知识传播、职业发展、软件开发等全生命周期服务,满足他们在职业发展中学习及共享知识和信息、建立职业发展社交圈、通过软件开发实现技术商业化等刚性需求。

    14 引用 • 155 回帖
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    196 引用 • 540 回帖 • 1 关注
  • Python

    Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。

    545 引用 • 672 回帖
  • 爬虫

    网络爬虫(Spider、Crawler),是一种按照一定的规则,自动地抓取万维网信息的程序。

    106 引用 • 275 回帖
  • 倾城之链
    23 引用 • 66 回帖 • 138 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架,可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作,它正在被越来越多的开发者和组织使用,并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 7 关注
  • 架构

    我们平时所说的“架构”主要是指软件架构,这是有关软件整体结构与组件的抽象描述,用于指导软件系统各个方面的设计。另外还有“业务架构”、“网络架构”、“硬件架构”等细分领域。

    142 引用 • 442 回帖 • 1 关注
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具,是一个全面整合的专业游戏引擎。

    25 引用 • 7 回帖 • 158 关注
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖 • 4 关注
  • PostgreSQL

    PostgreSQL 是一款功能强大的企业级数据库系统,在 BSD 开源许可证下发布。

    22 引用 • 22 回帖
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 172 关注
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖
  • 音乐

    你听到信仰的声音了么?

    61 引用 • 511 回帖 • 1 关注
  • jsDelivr

    jsDelivr 是一个开源的 CDN 服务,可为 npm 包、GitHub 仓库提供免费、快速并且可靠的全球 CDN 加速服务。

    5 引用 • 31 回帖 • 72 关注
  • JVM

    JVM(Java Virtual Machine)Java 虚拟机是一个微型操作系统,有自己的硬件构架体系,还有相应的指令系统。能够识别 Java 独特的 .class 文件(字节码),能够将这些文件中的信息读取出来,使得 Java 程序只需要生成 Java 虚拟机上的字节码后就能在不同操作系统平台上进行运行。

    180 引用 • 120 回帖 • 2 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎,可以结合 MySQL、PostgreSQL 做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索。

    1 引用 • 221 关注
  • ZeroNet

    ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。

    1 引用 • 21 回帖 • 632 关注
  • 支付宝

    支付宝是全球领先的独立第三方支付平台,致力于为广大用户提供安全快速的电子支付/网上支付/安全支付/手机支付体验,及转账收款/水电煤缴费/信用卡还款/AA 收款等生活服务应用。

    29 引用 • 347 回帖 • 5 关注
  • SQLServer

    SQL Server 是由 [微软] 开发和推广的关系数据库管理系统(DBMS),它最初是由 微软、Sybase 和 Ashton-Tate 三家公司共同开发的,并于 1988 年推出了第一个 OS/2 版本。

    21 引用 • 31 回帖 • 5 关注
  • Ubuntu

    Ubuntu(友帮拓、优般图、乌班图)是一个以桌面应用为主的 Linux 操作系统,其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词,意思是“人性”、“我的存在是因为大家的存在”,是非洲传统的一种价值观,类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。

    126 引用 • 169 回帖
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    171 引用 • 512 回帖