Window.location.reload Refresh usage Analysis (Go to dialog box) _ Basics

Source: Internet
Author: User
Tags eval tagname

When you use Window.location.reload Refresh, if you submit your data, you will get annoying dialog boxes!

To resolve this issue, you should write this:
Window.location.href=window.location.href;
Window.location.reload;
Similarly, if you are refreshing the parent window, you should write this:
Window.opener.location.href=window.opener.location.href;
Window.opener.location.reload ();
This kind of writing will not appear that annoying dialog box!

The method of realizing refreshing IFrame in JS
<iframe src= "1.htm" name= "Ifrmname" id= "Ifrmid" ></iframe>

Scenario One: Use the name attribute of the IFRAME to locate

<input type= "button" name= "button" value= "button"
onclick= "Document.frames (' Ifrmname '). Location.reload ()" >

Or

<input type= "button" name= "button" value= "button"
Onclick= "Document.all.ifrmname.document.location.reload ()" >

Scenario Two: Using the id attribute of the IFRAME to locate

<input type= "button" name= "button" value= "button"
Onclick= "Ifrmid.window.location.reload ()" >

Ultimate solution: When iframe src is another Web site address (cross-domain operation)

<input type= "button" name= "button" value= "button"
onclick= "window.open (document.all.ifrmname.src, ' ifrmname ', ')" >

Following IE instead of Internet Explorer, MF replaces Mozzila Firefox

1. Document.form.item question
(1) Existing problems:
There are many Document.formName.item ("itemname") statements in existing code that cannot be run under MF
(2) Solution:
Switch to document.formname.elements["ElementName"]
(3) Other
See also 2

2. Collection Class object problem
(1) Existing problems:
Many collection class objects in existing code use (), IE can accept, MF cannot.
(2) Solution:
Use [] as the subscript operation instead. For example: Document.forms ("FormName") changed to document.forms["FormName"].
Also as follows: Document.getelementsbyname ("InputName") (1) Changed to Document.getelementsbyname ("InputName") [1]
(3) Other

3. window.event
(1) Existing problems:
Unable to run on MF using window.event
(2) Solution:
MF event can only be used at the scene of the incident, this problem can not be resolved. You can do this:
Original code (can run in IE):

<input type= "button" Name= "Somebutton" value= "submit" onclick= "/> <script language= 
" JavaScript "> 
 function Gotosubmit () { 
  alert (window.event);//Use window.event 
 } 

New code (can run in IE and MF):

<input type= "button" Name= "Somebutton" value= "submit" onclick= "/> <script language= 
" JavaScript "> 
 function Gotosubmit (evt) { 
  evt = evt? evt: (window.event? window.event:null); 
  alert (EVT); Use EVT 
 } 

In addition, if the first line in the new code does not change, the same as the old code (that is, the gotosubmit call does not give the parameter), it still can only run in IE, but not error. Therefore, the TPL part of this scheme is still compatible with the old code.

4. The ID of an HTML object as an object name problem
(1) Existing problems
In IE, the ID of an HTML object can be used directly as the subordinate object variable name of document. Not in MF.
(2) Solving method
Use getElementById ("Idname") instead of Idname as an object variable.

5. Obtaining an object with a idname string
(1) Existing problems
In IE, you can use Eval (idname) to obtain an HTML object with an ID of idname, which cannot be in MF.
(2) Solving method
Replace eval (idname) with getElementById (Idname).

6. Variable name and an HTML object ID the same problem
(1) Existing problems
In MF, because the object ID is not the name of an HTML object, you can use the same variable name as the HTML object ID, which is not available in IE.
(2) Solving method
In the declaration of variables, all add Var, to avoid ambiguity, so that in IE can also be normal operation.
In addition, it is best not to take variable names that are the same as the HTML object IDs to reduce errors.
(3) Other
See question 4

7. Event.x and EVENT.Y issues
(1) Existing problems
In IE, the event object has an X, y attribute, which is not in MF.
(2) Solving method
In MF, the equivalent of Event.x is Event.pagex. But Event.pagex ie did not.
Therefore, the use of Event.clientx instead of event.x. This variable is also available in IE.
There are subtle differences between Event.clientx and Event.pagex (when the entire page has a scroll bar), but most of the time it is equivalent.

If you want to be exactly the same, you can be a little more troublesome:
MX = Event.x? Event.x:event.pagex;
And then use MX instead of event.x.
(3) Other
Event.layerx in IE and MF, the specific meaning of the difference has not yet been tested.

8. About Frame
(1) Existing problems
In IE, you can use Window.testframe to get the FRAME,MF.
(2) Solving method
The main differences between MF and IE in the use of frame are:
If the following attributes are written in the frame label:
<frame src= "xx.htm" id= "Frameid" name= "FrameName"/>
Then IE can access the Window object for this frame by ID or name
MF can only access the window object of this frame through name
For example, if the frame tag is written in the HTM inside the top-level window, you can access the
Ie:window.top.frameId or Window.top.frameName to access this window object
MF: Only so window.top.frameName to access this window object

In addition, Window.top.document.getElementById ("Frameid") can be used in both MF and IE to access the frame label
And you can switch the contents of the frame by window.top.document.getElementById ("Testframe"). src = ' xx.htm '.
You can also switch the contents of a frame by window.top.frameName.location = ' xx.htm '
A description of frame and window can be found in the ' window and frame ' article of BBS
And the test below the/test/js/test_frame/directory.
----Adun 2004.12.09 Revision

9. In MF, the attribute defined by itself must be getattribute () to obtain
10. No parentelement Parement.children in Mf
ParentNode Parentnode.childnodes
ChildNodes the meaning of the subscript is different in IE and MF, MF uses the DOM specification, ChildNodes inserts a blank text node.
It is generally possible to avoid this problem by Node.getelementsbytagname ().
When nodes in HTML are missing, IE and MF have different interpretations of parentnode, such as
<form>
<table>
<input/>
</table>
</form>
The value of Input.parentnode in MF is form, while the value of Input.parentnode in IE is an empty node

There is no Removenode method for nodes in MF, you must use the following method Node.parentNode.removeChild (node)

11.const problem
(1) Existing problems:
The Const keyword cannot be used in IE. such as const CONSTVAR = 32; This is a syntax error in IE.
(2) Solution:
Do not use const instead of Var.

A. Body Object
MF body in the body tag is not fully read by the browser before the existence, and IE must be completely read into the body after the existence of

URL encoding
In JS if the write URL directly write & do not write & such as var url = ' xx.jsp?objectname=xx&objectevent=xxx ';
Frm.action = URL It is likely that the URL will not be displayed properly so that the parameter is not uploaded to the server correctly
General Server error parameter not found
Of course, if the exception is in the TPL, because the TPL conforms to the XML specification, the requirement & write as &
General MF cannot recognize the & in JS


NodeName and TagName issues
(1) Existing problems:
In MF, all nodes have nodename values, but textnode do not have tagName values. In IE, the use of nodename is as good as
There is a problem (the situation is not tested, but my IE has been dead several times).
(2) Solution:
Use TagName, but you should detect if it is empty.

15. Element attributes
IE under the Input.type property is read-only, but MF can be modified


Problems with Document.getelementsbyname () and Document.all[name]
(1) Existing problems:
In IE, Getelementsbyname (), Document.all[name] can not be used to obtain DIV elements (whether there are other elements that cannot be taken is unknown).


1,document.getelementbyid alternative document.all (ie applicable)
2, set [] substitution () (ie applicable)
3,target replaces Srcelement;parentnode replacement parentelement (parentnode ie applicable)
4,node.parentnode.removechild (node) replaces Removenode (this) (ie applies)
5, with a blank text node
6, no outerHTML property
7, Event local variable e replaces event global variable events
8,e.button key values differ from Event.button, with only 3 key values and no combined key values
9, no Ondrag events
10,dommousescroll replaces Onmousewheel;-e.detail instead of Event.wheeldelta
11,addeventlistener replaces Attachevent;removeeventlistener instead of detachevent
12,e.preventdefault () instead of event.returnvalue=false;e.stoppropagation () instead of event.cancelbubble=true
13,style.top, style.left, etc. strictly check "px" unit (plus "px" ie applicable)
14,style= "-moz-opacity:0.9" replaces style= "Filter:alpha (opacity=90)"; no other filter
15,style.cursor= "pointer" replaces style.cursor= "hand" (ie applies)
16,title replaces Alt (IE applies)
17, the status bar default is not modifiable, you need to adjust the FF settings
18, built-in drawing function to replace VML with canvas or SVG
19, the code error often do not complain (want to also be ff the helplessness of it, if each ie unique expression of the way in it all the error, even if the newspaper is not reported to come to it)
20, cleanup of the cache is very bad
Note: the "IE applicable" for the general recommendation of the wording, not marked in IE does not apply.

All of the following IE refer to IE6.0

Verify is IE browser (to Google JS)

var agt=navigator.useragent.tolowercase ();
var is_ie= (Agt.indexof ("MSIE")!=-1 && document.all);
Officially started

Event Delegate Method

Ie

Document.body.onload = inject; Function inject () was implemented prior to this

Firefox

Document.body.onload = inject ();

Some say the standard is:

Document.body.onload=new Function (' inject () ');


Can't get event.srcelement in Firefox

Passing objects by other means

if (Isie) 
thistable.attachevent ("onmousedown", Onclickchangetdbackcolor); 
Thistable.onmousedown=onclickchangetdbackcolor; 
Else//deal Firefox 
{for 
(var i=0;i<thistable.rows.length;i++) 
{ 
var rowobj = thistable.rows[i]; 
for (Var j=0;j<rowobj.cells.length;j++) 
{ 
var cellobj = rowobj.cells[j]; 
Cellobj.setattribute ("onmousedown", "Onclickchangetdbackcolor (This)"); 
} 
alert (rowobj.cells[0].tagname); 
} 

This is the http://blog.joycode.com/lostinet/archive/2005/02/27/44999.aspx.

Writing event-handling functions under Firefox is a hassle.
Because Firefox has no window.event. If you want to get an event object, you must declare that the first parameter of the time processing function is event.

So in order to be compatible with IE and Firefox, the general event handling method is:
Btn.onclick=handle_btn_click;
function Handle_btn_click (EVT)
{
if (evt==null) evt=window.event;//ie
Handle the event.
}
For simple programs, this is not a hassle.

But for some complex programs, a write function is not directly linked to the event. If you want to pass the event to this parameter, then all the methods have to pass the event. This is a nightmare.

Here's a way to solve this problem, and the principle.

In JScript, the invocation of a function has a func.caller this property.
For example
function A ()
{
B ();
}
function B ()
{
alert (B.caller);
}
If B is called by A, then B.caller is a

In addition, the function has a arguments property. This property can traverse the parameters currently executing by the function:
function Myalert ()
{
var arr=[];
for (Var i=0;i
Arr[i]=myalert.arguments[i];
Alert (Arr.join ("-"));
}
Alert ("Hello", "World", 1,2,3)
You can show hello-world-1-2-3.
(The number of arguments is related to the caller, but not to the parameter definition of the function)

Based on these two properties, we can get the event object for the first function:

Btn.onclick=handle_click; 
function Handle_click () 
{ 
showcontent (); 
} 
function showcontent () 
{ 
var evt=searchevent (); 
if (Evt&&evt.shiftkey)//If the call is based on an event, and shift is pressed 
window.open (global_helpurl); 
else 
location.href=global_helpurl; 
} 
function searchevent () 
{ 
func=searchevent.caller; 
while (Func!=null) 
{ 
var arg0=func.arguments[0]; 
if (arg0) 
{if 
(arg0.constructor==event)//If is the Event object return 
arg0; 
} 
Func=func.caller; 
} 
return null; 

This example uses Searchevent to search for an event object. Where ' Event ' is the event.constructor of FireFox.
When the example is run, the
Searchevent.caller is showcontent, but showcontent.arguments[0] is empty. So Func=func.caller, Func becomes Handle_click.
Handle_click is called by FireFox, although no parameters are defined, but when invoked, the first argument is event, so Handle_click.arguments[0] is an event!

For the above knowledge, we can combine prototype.__definegetter__ to realize the implementation of window.event under FireFox:

Here's a simple code. Interested in can add

if (Window.addeventlistener) 
{ 
Fixprototypeforgecko (); 
} 
function Fixprototypeforgecko () 
{ 
htmlelement.prototype.__definegetter__ ("Runtimestyle"), Element_ Prototype_get_runtimestyle); 
WINDOW.CONSTRUCTOR.PROTOTYPE.__DEFINEGETTER__ ("event", window_prototype_get_event); 
event.prototype.__definegetter__ ("srcelement", event_prototype_get_srcelement); 
} 
function Element_prototype_get_runtimestyle () 
{ 
//return style instead ... 
return this.style; 
} 
function window_prototype_get_event () 
{return 
searchevent (); 
} 
function event_prototype_get_srcelement () 
{return 
this.target; 
} 

function searchevent () 
{ 
//ie 
if (document.all) return 
window.event; 

Func=searchevent.caller; 
while (Func!=null) 
{ 
var arg0=func.arguments[0]; 
if (arg0) 
{ 
if (arg0.constructor==event) return 
arg0; 
} 
Func=func.caller; 
} 
return null; 
} 
</body> 
 

The difference between Firefox and the parent element of IE (parentelement)

Because both Firefox and IE support DOM, using Obj.parentnode is a good choice.

Ie
Obj.parentelement
Firefox
Obj.parentnode

The difference between UniqueID and ClientID in asp.net

To use the document.getElementById method, you do this when you use the control

"Javascript:onselectsubcatalog (\" "+SUBCATALOG_DRP.) Clientid+ "\", "+catalogidx+", "+catid.tostring () +");

The difference between calling a SELECT element

Move out of a selection

--------------------------------------------------------------------------------

IE:sel.options.remove (Sel.selectedindex);
Firefox:

To increase the selection:

--------------------------------------------------------------------------------

IE:subCatalog.add (New Option (Text,value));

Firefox

var opnobj = document.createelement ("option");
Opnobj.id = optionID;
Opnobj.value = value;
Opnobj.text = text;
Subcatalog.appendchild (Opnobj);

Cursor:hand VS Cursor:pointer

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.