关于在easyui中添加tab的时候不能执行href页面中的js的说明

最新推荐文章于 2020-03-12 10:02:14 发布

wujiang88

最新推荐文章于 2020-03-12 10:02:14 发布

阅读量2.1k

点赞数

分类专栏： easyui

easyui 专栏收录该内容

1 篇文章

订阅专栏

本文探讨了在使用EasyUI的Tab组件时遇到的问题：通过addTab方法添加的HTML页面中的JS无法执行。分析了EasyUI Panel加载内容的两种方式，并提供了一个具体的案例来解释如何正确加载外部HTML片段。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文参考：http://www.jeasyuicn.com/post-49.html

问题是这样的：我今天在使用easy中的add tab的方法的时候我原先添加的是一个html完整的页面，但是当我add tab的时候，我发现js无法执行，但是当我直接访问这个jsp的时候里面的js是可以执行的，这个时候上网找了一下，发现在easyUI中

不管是window，dailog还是tab其实质最终都是继承了panel。panel有两种方式展示内容。第一是直接硬编码写到出来。第二是通过href属性，加载外部html片段。在这里就就设计到了一个html片段的概念。这个概念在easyui的整体架构中，是一个很重要的概念，因为很多人没弄明白，所以从中引发出了很多问题。我举个例子来说明html片段。

这个片段的话就是在我们href加载的文件中可能没有完整的一个html文件中的元素，比如：<html></html>,<head></head>，<body></body>等

它可能就是一个

<form id="userInfo">
<input id="pin" name="pin" type="text" />
<input id="but1" value="查找" type="button" />
</form>
<div id="poolDiv">
<input id="poolBut" type="button" value="打印池中数据">
<div id="printDiv"></div>
</div>
<script type="text/javascript" src="${pageContext.request.contextPath }/jquery-easyui-1.4.5/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#but1").click(function() {
var pin = $("#pin").val();
$.post("${pageContext.request.contextPath }/add_cmd", {"pin":pin}, function(data) {
console.info(data);
});
});
$("#poolBut").click(function() {
$.post("${pageContext.request.contextPath }/print_pool", {}, function(data) {
$("#printDiv").html("<p>"+data+"</p>");
});
});
});
</script>