【问题标题】:jQuery in CodeIgniter, inside the view or in external js file?CodeIgniter 中的 jQuery,在视图内部还是在外部 js 文件中?
【发布时间】:2011-01-20 20:45:28
【问题描述】:

我正在使用 CodeIgniter 开发 Web 应用程序。一直以来,我都将自定义 js 代码放在视图文件中来做一些花哨的事情。通过这样做,我可以使用 CodeIgniter 提供的site_url()base_url() 函数。

今天我想将所有自定义 js 代码从视图文件中分离到一个外部 js 文件中。然后它击中了我,我不能在外部js文件中使用site_url()base_url()。因此,我不得不将 js 代码移回视图文件中。

我想就这类问题征求意见、示例和最佳实践。您是将自定义 js 代码放在视图中还是外部 js 文件中?如果你把它放在外部文件中,你如何解决site_url()base_url() 的需求(当然要放上我要避免的绝对网址)。

【问题讨论】:

    标签: php javascript jquery codeigniter


    【解决方案1】:

    我通常将我的文件保存在一个外部文件中,但在我的模板(视图)中放置一行,声明一个名为“baseurl”的 javascript 变量,以后可以由我的外部 javascript 使用。

    <script type="text/javascript">
      var baseurl = "<?php print base_url(); ?>";
    </script>
    <script type="text/javascript" src="/js/scripts.js"></script>
    

    现在我的 scripts.js 文件可以通过自己的 baseurl 变量访问 base_url() 值。

    【讨论】:

    • +1 用于将base_url() 传递给外部 js 文件的绝妙技巧。现在剩下site_url(),也许我可以使用相同的技巧,将其存储到js变量中。
    • 是的,它有效。我的代码需要对一些不同的 url 进行 AJAX 请求,所以我只需将所有需要的 url 保存到一个变量中:var url_1 = "&lt;?php echo site_url('controller/method1'); ?&gt;"; 等等。
    • 感谢这个技巧!要记住的一件事是将您的 php print 语句用引号括起来,例如: var baseurl = ""
    • @nandasunu:不敢相信我忘记了这些。我已经更新了答案。感谢您指出这一点!
    • 我有,但我想昨天我的互联网连接失败了。
    【解决方案2】:

    我会以不同的方式来做——显然,js 应该是外部的,但为什么不充分利用您拥有一个非常适合处理所有 javascript 魔法的 MVC 框架这一事实呢?

    这是我使用 CI 获得 Javscript(和 CSS)优点的秘诀:

    1. 获取Minify 的副本 - 如果您还不知道,您的生活会更好。不是以“一见钟情/我刚刚发现 jQuery / xkcd / 单元测试”之类的方式,但至少以“伙计,准备好的语句消除 SQL 注入 "的方式。

    2. 其次,创建一个封装Minify的CI控制器(不要太难,记得设置正确的HTTP头并传递参数)

    3. 可选择激活缓存以使一切运行得非常快(Minify 内置了缓存,但如果您已经在缓存 CI 内容,您不妨在此处使用相同的方法。

    4. 可选地为 Minify 定义一些组,以使脚本加载更加流畅

    5. 可选地将 baseurl 和 siteurl 变量(以及您可能需要的任何其他值)添加到 javascript 输出中

    6. 然后,您现在应该可以通过调用 Minify-wrapper 来加载脚本了:

      &lt;script type="text/javascript" src="/min/g=js"&gt;&lt;/script&gt;

    它速度极快,经过 gzip 压缩,只需要一个请求而不是多个请求,它让您可以对脚本进行完全的 CI 控制,甚至可以让您的源代码更简洁。


    哦,如果您想对偷窥源代码的访问者更加友好,您可以自动在输出中添加类似这样的内容:

    // Javascript compressed using Minify by Ryan Grove and Steve Clay
    // (http://code.google.com/p/minify/)
    // Human-readable source files:
    
    // http://www.yourdomain.com/js/core_functions.js
    // http://www.yourdomain.com/js/interface.js
    // http://www.yourdomain.com/js/newsticker.js
    // http://www.yourdomain.com/js/more_magic.js
    
    (...)
    

    至少我是这样做的。

    【讨论】:

    • 感谢您的建议。是的,我期待即时进行缩小,但同时没有时间去做。我可能会在下一个项目中实现你的方式。
    • 真的没那么难,Minify 为你做了所有的魔法。如果您使用超过 5-6 个不同的脚本,那将是值得的。但重点是,我可能应该将它构建为一个千篇一律的 CI 库。
    【解决方案3】:

    Donny,如果您开始分别通过每个 URL,您只会让自己感到头疼。为什么不直接通过 base_url() 并在最后联系控制器/方法?

    你失去了交换 index_page 和 url_suffix 设置的能力,但它们不应该经常改变。

    【讨论】:

    • Phil,我只是想确保如果我更改 url_suffixindex_page 配置,所有 url 仍然有效。这就是为什么我坚持使用 site_url() 与控制器名称和方法 + 所需的 uri 段作为参数写入,而不是仅仅连接它。我按模块拆分外部 js 代码,通常每个模块最多只需要大约 4 个 url,因此将其存储到 javascript 全局变量中就足够了,并且在我的情况下运行良好。
    • 附加信息,出于个人目的,我将所有需要的库和变量名作为注释写在外部 js 文件中,所以通过阅读它,我将知道应该加载什么库以及应该加载什么变量在加载这个 js 文件之前初始化。
    猜你喜欢
    • 1970-01-01
    • 2017-12-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多