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

  1. jsp:include是先编译一下included.jsp文件,然后再包含 先编译,后包含
  2. @ 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. ESXI服务器的四个网口负载均衡

    什么是NIC Team(负载均衡) NIC Team其实就是将多个物理网卡同时分配到相同的端口/端口组,目的是为了实现带宽聚合,负载均衡以及故障转移 配置NIC Team 一.选择一台ESXi主机,打 ...

  2. Redis 密码设置和查看密码

    Redis 密码设置和查看密码 redis没有实现访问控制这个功能,但是它提供了一个轻量级的认证方式,可以编辑redis.conf配置来启用认证. 1.初始化Redis密码: 在配置文件中有个参数: ...

  3. elastix php session保存地点

    这段时间要做 asterisk 的HA 放啊,需要同步session,所以做了下来研究. 1)elastix中的session 其实是存放在 /tmp/目录中的.可是/etc/php.ini中的[se ...

  4. 自己写的一个jQuery对联广告插件

    效果图: 文件的位置摆放: 插件的代码: ;(function($){ $.extend({ dLAdv:function(options){ var defaults={ leftType:0,// ...

  5. C# Atomic<T> Generic

    using System; using System.Threading; /// <summary> /// Provides lock-free atomic read/write u ...

  6. Spark SQL 编程

    Spark SQL的依赖 Spark SQL的入口:SQLContext 官方网站参考 https://spark.apache.org/docs/1.6.2/sql-programming-guid ...

  7. 微信通过openID发送消息/后台post、get提交并接收数据

    控制器:下面是post发送消息(微信不支持从前台发送数据,之前试过,报错,需要跨域,跨域的问题解决后还不行,最后发现之后后端提交 WXApi类: #region 验证Token是否过期 /// < ...

  8. UVA548

    题意: 根据二叉树中序和后序建立二叉树,从根结点开始计算和到叶子结点,输出总和最小的叶子结点,如果有俩个和一样大,输出叶子结点最小的 AC:80ms #include<stdio.h> # ...

  9. python-log-env

    logging.basicConfig(format="[%(asctime)s] %(filename)s[line:%(lineno)d] %(levelname)s: %(messag ...

  10. nginx支持pathinfo的方法,亲测有效的

    修改配置文件,修改特点域名的配置文件 location ~ \.php { #去掉$ root H:/PHPServer/WWW; fastcgi_pass ; fastcgi_index index ...