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
随机推荐
- Robot常用Library安装
Python-Library: yum install -y mysql-devel python-devel python-setuptools pip install MySQL-python p ...
- 6.12-PrepareStatement,JdbcUtil 读取数据库配置文件properties,dao模式
一.PrepareStatement 防止sql注入 PrepareStatement 是预编译sql语句 更加灵活,更有效率 executeUpdate() 做增删改 executeQuery() ...
- Unity的JIT和AOT实现
https://myhloli.com/about-il2cpp.html JIT方式: Unity的跨平台技术是通过一个Mono虚拟机实现的.而这个虚拟机更新太慢,不能很好地适应众多的平台. And ...
- HP-UX oracle RAC 双机实践 (转载)
一.软硬件配置检查 1.检查内存#/usr/contrib/bin/machinfoCPU info: 4 Intel(R) Itanium 2 9100 series processors (1. ...
- NLP-Progress记录NLP最新数据集、论文和代码: 助你紧跟NLP前沿
Github https://github.com/sebastianruder/NLP-progress 官方网址 https://nlpprogress.com/ NLP-Progress 同时涵 ...
- MySQL数据库储存引擎Inoodb一--记录储存结构
在开文我先说明一下,接下来的数据库知识文章都是在微信公众号“我们都是小青蛙”学习然后在通过自己的理解进行书写的.有兴趣的朋友可以去关注这个微信公众号.话不多说,我们在日常使用数据库进行数据持 久化的时 ...
- etcd查看key-value
get/set key-value etcdctl get/set /key-path etcdctl watch --recursive /test/sm/default/apps 查看所有key- ...
- lb集群lvs的3种模式
Cluster原理 集群的总类: 1.负载均衡集群(LB:Load Banlancing):实现将一个访问量或者任务量特别大的应用,给他 平均分配到不同的服务器上面,以提供高容量.大并发. 2.高可用 ...
- Mybatis 为什么不要用二级缓存
https://www.cnblogs.com/liouwei4083/p/6025929.html mybatis 二级缓存不推荐使用 一 mybatis的缓存使用. 大体就是首先根据你的sqlid ...
- 比较完整的URL验证
转自:http://wuchaorang.2008.blog.163.com/blog/static/4889185220135279223253/ function IsURL(str_url){v ...