There have been many people in the group response, in the tab loading interface, the interface of the JS will not be executed. Today godson here to explain why.
Both the Window,dailog and the tab quality eventually inherit the panel. The Panel has two ways of presenting the content. The first is the direct hard-coded write-out. The second is to load the external HTML fragment through the href attribute. The concept of an HTML fragment is designed here. This concept is a very important concept in the overall architecture of Easyui, because many people do not understand it, so it causes a lot of problems. Let me give an example to illustrate the HTML fragment.
We all know that the standard structure of HTML is:
3 |
<title>这是完整的html结构</title> |
Generally we write HTML code that should follow this structure. The so-called HTML fragment is the content part of the complete structure above.
Although we will also create a file such as b.html to save the HTML fragment, but in this b.html we only need to write <body> inside the content does not need to write the standard structure of HTML.
Well, to understand the concept of HTML fragments, I'm going to use a lot of HTML fragments in the process of using a easyui.
In fact, in the use of Easyui you do not embed the IFRAME, in addition to the index interface will have a complete HTML structure, all the other interfaces are in the form of HTML fragments. For that tab, first define a tabs on the interface
03 |
<title>tab测试界面</title> |
" |
< Code class= "keyword" >div class = "Easyui-tabs" fit = "true" plain = "true" style = "height:100px;width:300px;" > |
" |
; < div title = "Title1" style = "padding:10px;" href = "tabs_href_test.html" ></ div > |
" |
; < div title = "Title2" style = "padding:10px;" >content 2</ div > |
09 |
<divtitle="Title3"style="padding:10px;">Content 3</div> |
See the Title= "Title1" at the top of the clip. I've defined a tab where the HREF attribute is used to indicate that this is where you want to load an HTML fragment externally to display the contents of the tab. Here's what I've defined for tabs_href_test.html.
1 |
<scripttype="text/javascript"src="test.js"></script> |
2 |
<script>alert("我是外部加载的html片段");</script> |
3 |
<div><p>我是外部加载的html片段</p></div> |
Content of Test.js:
There must be a lot of people here to tell me, I wrote this, but my JS is not executed at all. In fact, I have seen a lot of people who want me to solve the problem of the class, sent me to see the code. If tabs_href_test.html were the external interface they introduced, it would be a complete structure like the following
03 |
<metahttp-equiv="Content-Type"content="text/html; charset=UTF-8"> |
04 |
<title>Tabs - jQuery EasyUI Demo</title> |
05 |
<scripttype="text/javascript"src="test.js"></script> |
06 |
<script>alert("我是外部加载的html片段");</script> |
09 |
<div><p>我是外部加载的html片段</p></div> |
They will all ask why JS is not executed. In fact, the problem is here. The tabs_href_test.html interface is actually the JQ request over the content via Ajax, in the append to the target area. The responsetext of the Ajax request method only grabs the contents of <body> inside the full HTML fragment. Just as they wrote their JS out of the body so that JS did not execute. This is true in the introduction of the interface does not appear
Finally, if you should use the Easyui to load the external interface components, such as: Panel,window,dailog,tabs. Make sure that the interface you introduce is an HTML fragment. HTML fragment correct wording again reminder do not appear
View Sourceprint?
1 |
<scripttype="text/javascript"src="test.js"></script> |
4 |
<script>alert("我是外部加载的html片段");</script> |
5 |
<div><p>我是外部加载的html片段</p></div> |
About Easyui's Window and tab page do not perform JS description
