On the backstage. jsp page, I wrote a method to add a panel (where the ID is MSG) at the specified position)
Function addtab (T, h ){
If ($ ('# MSG'). tabs ('exists', t )){
$ ('# MSG'). tabs ('select', t );
} Else {
$ ('# MSG'). tabs ('add ',{
Title: T,
Href: H
});
}
}
There is a hyperjoin in the body method.
<A id = "Admins"> View administrator Information </a>
Method call
$ ("# Admins"). Click (function (){
Addtab ('administrator information', '$ {pagecontext. Request. contextpath}/backstage/admins/findadmins. jsp ');
});
Findadmins. jsp
<Head>
<SCRIPT>
$ (Function (){
Alert ("------");
});
</SCRIPT>
</Head>
<Body>
This is the findadmins. jsp page. The event is triggered.
<Body>
The problem I encountered was that when I added the panel, findadmins. the content in the body in JSP will be displayed, but the method in the head is not executed. At first, I thought it was a path problem. But if it was a path problem, why can the content in the body be correctly displayed?
I have a headache. Why?
Next, let me answer my own question. The main reason for this is that I don't know a lot of things and I don't know much about things.
The href method has the following features:
The first is that only the content inside the body element of the loaded page is loaded. That is, jquery's Ajax request only contains HTML fragments. (You should pay attention to this problem, including myself.) There is also a mask effect when loading remote URLs, that is, "waiting ......" Results: better user experience.
However, when the page layout to be loaded is complex, or a large number of JS scripts need to be run, the encoding usually requires caution, which is prone to problems. The following describes some common href problems found on the Internet.
1. href: only load the HTML segment of the target URL
This feature is determined by the Ajax request processing mechanism encapsulated by jquery. Therefore, tags such as HTML, Head, and body do not need to be included in the target URL page. Even if these elements exist, it will also be ignored, so no script in the head label will be introduced or executed.
2. Brief page chaos:
When pages with href links are complex, easyui usually requires a long process to render them. At this time, the HTML fragments that are loaded have no layout, and the page will automatically be fine later, at this time, easyui has completed its rendering. To avoid this chaotic process, we have to rely on the basic plug-in of easyui-parser ).
Parser has an oncomplete event, which is triggered when easyui finishes rendering the page. The idea is clear: Use a div to mask HTML fragments that are loaded, in the oncomplete event, let this Div fade out. At this time, the rendered HTML fragment will be able to take a bath for the beauty, and at the same time, it will have a waiting effect, killing two birds with one stone. In this case, we need to do two things:
First, place a div for the mask in the HTML fragment to be loaded:
<Div id = 'loading' style = "position: absolute; Z-index: 1000; top: 0px; left: 0px; width: 100%; Height: 100%; Background: # dddddb; text-align: center; padding-top: 20%; ">
<Image src = 'style/images/loading.gif '/>
</Div>
The second is to process related events at the end of the loaded HTML snippet:
<SCRIPT>
Function show (){
$ ("# Loading"). fadeout ("normal", function (){
$ (This). Remove ();
});
}
VaR delaytime;
$. Parser. oncomplete = function (){
If (delaytime)
Cleartimeout (delaytime );
Delaytime = setTimeout (show, 500 );
}
</SCRIPT>
Note that if the oncomplete event is used on multiple tab pages, the defined items will overwrite the previously defined ones. In fact, the oncomplete event is called every time easyui rendering is complete. Therefore, every time a tab page containing the easyui control is opened, the oncomplete event is called.
3.The easyui component-related script of the HTML segment inexplicably reports an error:
In fact, this phenomenon is the same as the reason for the first phenomenon. It takes some time for easyui to complete HTML fragment rendering. The more complicated the page, the longer the time consumption, at this time, it is difficult to avoid calling some plug-ins of easyui in HTML scripts, such as DataGrid. At this time, an error will be reported. The solution is the same as above. Put these scripts in the oncomplete event for processing, this ensures that the rendering will not be executed before the rendering is complete.
4. the prompt information for Form Verification in the window will be in disorder:
This phenomenon should be a bug of the plug-in itself. These special things are not taken into account in location calculation. The solution can be opportunistic. After opening the window, let the input that does not conform to the verification form get the focus.
Data Loading using content:
1. Flexible. You can spell the HTML code in the script and assign the content attribute to the tab. However, this write method will make the code easier to understand.
2. You can assign an IFRAME to the content and embed an IFRAME.
3. Using IFRAME will cause repeated loading of client JS and waste of resources. For example, if you want to reference the easyui library on your homepage, your IFRAME will also be referenced.
I hope it will be helpful to you. Don't make such mistakes any more !!!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
