js 放在公共头部 子页面引用js 失效问题
先回忆一下二者的区别(对于此篇文章而言,二者在用法上没有区别)
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 失效问题的更多相关文章
- .Net MVC关于子页面引用js库问题
layout页面中的配置: @RenderSection("scripts", required: false) @RenderSection("Styles" ...
- Js动态获取iframe子页面的高度////////////////////////zzzz
Js动态获取iframe子页面的高度 Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...
- 【shiro】使用shiro搭建的项目,页面引用js,报错:Uncaught SyntaxError: Unexpected token <
使用shiro搭建项目过程中,总是出现登录页面 登录第一次有效果,登陆第二次出现302状态码,第三次又有效果,第四次又没有效果的局面. 因此,采用ajax提交页面登录的用户名和密码,但是在引用js的过 ...
- 高德地图 JS API (jsp + miniui(子页面数据返回父页面并设值) + 单个点标记 + 点标记经纬度 + 回显 + 限制地图显示范围+搜索)
-*- 父页面js function mapFocus(){ //console.log("-*-"); var longitude = mini.get("jd&qu ...
- Js动态获取iframe子页面的高度总结
问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 给元素设置高度 这方法是用在父级页面里的,通过获取子级页面的高度给iframe设置 ...
- angular.js前端分层开发(页面和js代码分离,并将js代码分层)
一. 抽取模块成base.js文件// 定义模块: var app = angular.module("eshop",['pagination']); 二. 抽取服务成brandS ...
- 典型:Eayui项目aspx页面引用js
<link href="../Scripts/easyui1.3.5/themes/default/easyui.css" rel="stylesheet" ...
- JS 中根据iframe子页面自动iframe高度
注意:为使页面有更好的兼容性,在使用以下代码前,请将aspx页中头部的<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional ...
- vs2010 mvc3创建的razor引擎模板页,子页面引用后出现当前上下文中不存在名称“ViewBag”
View文件夹下缺少Web.config
随机推荐
- css实现文本两行或多行文本溢出显示省略号
word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/ -webkit-b ...
- mybatis匹配字符串的坑
where语句中我们经常会做一些字符串的判断,当传入的字符串参数为纯数字时,在mybatis的条件语句test里匹配全数字字符串需要注意会有如下现象: 所以里面的字符串需要加单引号,mybatis是匹 ...
- ajax调用json
//var data_str='({"detail":[{"html":"科技科技科技有限公司"},{"html":&q ...
- html页面中iframe导致JavaScript失效
<body onload=“reset()”> <div id="part1"> some thing here .... <div> < ...
- as3 声明变量
var a:int=0, b, c:Number=2; trace(a,b,c) /* 0 undefined 2 */ var a:int, b:uint, c:Number; var d:Stri ...
- 模板引擎-freemarker
Freemarker 是一款模板引擎,是一种基于模版生成静态文件的通用 工具,它是为java程序员提供的一个开发包. 可通过将Word或者Excel模板另存为xml格式,在其中修改要替换的内容. 基本 ...
- chrome 设置是否缓存
在进行本地开发时,因老需要修改js,css等文件,而页面又带有缓存因此无法自动更新为新的文件. 在页面点击 -> F12 ->F1 ->References -> NetWor ...
- Tomcat Servlet学习
参照: 浅谈cookie跨域的解决方案——document.domain(http://blog.csdn.net/zhouziyu2011/article/details/61200943) Ser ...
- 前端-CSS-3-高级选择器
高级选择器 总结: <!-- 总结: 基础选择器: 1.标签选择器 div 2.类选择器 .div1 3.id选择器 #box 4.通配符选择器 * 高级选择器: 1.群组选择器 中间用, .t ...
- 前端开发-2-HTML
1.开发环境 市面上有很多的HTML编辑器可以选择,常见的Hbuild.Sublime Text.Dreamweare都可以用来开发HTML. 当然PyCharm也支持HTML开发. 2.文件后缀名规 ...