先回忆一下二者的区别(对于此篇文章而言,二者在用法上没有区别)

jsp:include是先编译一下included.jsp文件,然后再包含        先编译,后包含
@ include是先把文件包含就来,然后统一编译 先包含,后编译

今天下午想把jQuery集成到项目中,发现怎么样都会出问题。原因就是路径问题。

在集成时,我的思路是写一个公共JSP文件,里面包含一些常用的js文件,当然此处我用的就是Jquery插件了。

但写完发现单独测试公共JSP是可以使用的,但包含公共JSP页面的页面却始终不能使用JQuery,开始还以为是加载顺序的问题。

几经测试,终于发现了其中的问题。

由于做的项目文件较多,故文件都不放在一个文件夹下:在公共JSP页面中,有

<%@ page language="Java" import="java.util.*" pageEncoding="utf-8"%>

<script type="text/JavaScript" src="js/jquery132min.js"></script>

<script type="text/javascript">    
    $(function(){
    alert('hello1');
    });
</script>

在调用它的时候,有:

<%@ include file="../../common_ext.jsp"%>

但这样很可能导致错误。

原因是,include之后,公共JSP被加载到自己的JSP,则JQueryr的相对位置已经发生了变化。即公共JSP把JQuery的相对位置传给了自己的JSP,但自己的JSP以自身为标准,通过路径就找不到Jquery插件了。简单地说,就是如果用相对路径,则公共JSP中的路径就应该是相对自己jSP的路径了。

但这样显然失去了它是公共JSP的意义,因此在这里用绝对路径来做:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%
String tPath = request.getContextPath();
String tBasePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+tPath+"/";
%>

<script type="text/javascript" src="<%=tBasePath%>js/jquery132min.js"></script>
    <script type="text/javascript">
    
    $(function(){
    alert('hello1');
    });
    
    </script>

这样,只要在自己的jSP页面中引入公共JSP就可以了。

js 放在公共头部 子页面引用js 失效问题的更多相关文章

  1. .Net MVC关于子页面引用js库问题

    layout页面中的配置: @RenderSection("scripts", required: false) @RenderSection("Styles" ...

  2. Js动态获取iframe子页面的高度////////////////////////zzzz

    Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...

  3. 【shiro】使用shiro搭建的项目,页面引用js,报错:Uncaught SyntaxError: Unexpected token <

    使用shiro搭建项目过程中,总是出现登录页面 登录第一次有效果,登陆第二次出现302状态码,第三次又有效果,第四次又没有效果的局面. 因此,采用ajax提交页面登录的用户名和密码,但是在引用js的过 ...

  4. 高德地图 JS API (jsp + miniui(子页面数据返回父页面并设值) + 单个点标记 + 点标记经纬度 + 回显 + 限制地图显示范围+搜索)

    -*-  父页面js function mapFocus(){ //console.log("-*-"); var longitude = mini.get("jd&qu ...

  5. Js动态获取iframe子页面的高度总结

    问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 给元素设置高度 这方法是用在父级页面里的,通过获取子级页面的高度给iframe设置 ...

  6. angular.js前端分层开发(页面和js代码分离,并将js代码分层)

    一. 抽取模块成base.js文件// 定义模块: var app = angular.module("eshop",['pagination']); 二. 抽取服务成brandS ...

  7. 典型:Eayui项目aspx页面引用js

    <link href="../Scripts/easyui1.3.5/themes/default/easyui.css" rel="stylesheet" ...

  8. JS 中根据iframe子页面自动iframe高度

    注意:为使页面有更好的兼容性,在使用以下代码前,请将aspx页中头部的<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional ...

  9. vs2010 mvc3创建的razor引擎模板页,子页面引用后出现当前上下文中不存在名称“ViewBag”

    View文件夹下缺少Web.config

随机推荐

  1. ORA-03113:通信通道的文件结尾

    问题: 用命令startup启动实例时,报错“ORA-03113:通信通道的文件结尾”. 解决: SQL> startup mount ORACLE 例程已经启动. Total System G ...

  2. 基于Vue的Ui框架

    基于Vue的Ui框架 饿了么公司基于vue开的的vue的Ui组件库 Element Ui 基于vue pc端的UI框架 http://element.eleme.io/ MintUi 基于vue 移动 ...

  3. 哈希与位图(Hash and BitMap)

    Hash:哈希机制 BitMap:位图机制 目的:都是为了保证检索方便而设置的数据结构 对于大数据进行排序,由于内存限制,不可能在内存中进行,所以采取BitMap机制 为了在大数据中快速检索以及操作数 ...

  4. KDD 2018 | 最佳论文:首个面向Facebook、arXiv网络图类的对抗攻击研究

    8 月 19 日至 23 日,数据挖掘顶会 KDD 2018 在英国伦敦举行,昨日大会公布了最佳论文等奖项.最佳论文来自慕尼黑工业大学的研究者,他们提出了针对图深度学习模型的对抗攻击方法,是首个在属性 ...

  5. python之路之装饰器

    一 装饰器进化之路1) import time def index(): start_time=time.time() time.sleep() print('welcome to index wor ...

  6. NHibernate 学习笔记(一)

    NHibernate 的简介: NHibernate是一个面向.NET环境的对象/关系数据库映射工具.对象/关系数据库映射(object/relational mapping (ORM))这个术语表示 ...

  7. ajax调用json

    //var data_str='({"detail":[{"html":"科技科技科技有限公司"},{"html":&q ...

  8. 国内各类“壳子”浏览器,userAgent 一览

    [测试环境]:测试日期:2014-6-20 我本机的chrome是36.0的,IE是10.0的.下列各浏览器大多数都是最新版,少数是半年以内的版本. 内核 chrome 版本 36.0 userAge ...

  9. mybatis 常用jdbcType数据类型

    来自 : http://blog.csdn.net/paincupid/article/details/50922981

  10. ios 获得webview user-agent

    UIWebView *webView = [[UIWebView alloc]initWithFrame:CGRectZero]; NSString *myUserAgent = [webView s ...