We will use a sample code to show how methods and properties in events dealing.
First, We introduce some basic fundamental below.
property:
defaultStatus, frames[], length, name, operator,parent,self,status,top, window
method:
alert(message), close, confirm(message), open(url,name,features),prompt(message,inputDefault), setTimeout(statement,delay),clearTimeout(timer)
Sample Code:
<!DOCTYPE html>
<html>
<head>
<title>hi</title>
<meta name="viewport" content="width=deivce-width; initial-scale=1.0;
maximum-scale=1.0;user-scalable=1.0;">
</head>
<body onLoad="alert(‘welcome’)" onUnload="alert(‘GoodBye’)">
function openURL(){
var url="https://www.google.com"
if(!window.winvar||winvar.closed)
var winvar =window.open(url)
else
winvar.location = url
}
function bt_details(this_bt){
var type= this_bt.type
var name= this_bt.name
var value = this_bt.value
document.write(“my type:"+type+"
“+“my name:"+name+"
“+“my value:"+value+"
“)}
function terminate(){
document.write(“before
“)return false
document.write(“after
“)}
// function: width, height, location, directories, menubar, scrollbars, status, toolbar,resizable
/*
var window_variable=window.open(“https://www.yahoo.com“,"mywebname","location, directories, menubar, scrollbars, status, toolbar,resizable=1″)
*/
var countnumber=0
var timer;
function count(){
countnumber++
timer=setTimeout(“count()",1000)
}
count()
//property: defaultStatus, frames[], length, name, operator,parent,self,status,top, window
<form>
<input type="button" value="open url" onClick="openURL()">
<input type="button" name="hello_button"
value ="Please click me" onClick="bt_details(this)">
<!– terminate –>
<input type="button" name="hello_button2″
value ="Please click me2″ onClick="terminate()">
</form>
<!–method
alert(message), close, confirm(message), open(url,name,features),prompt(message,inputDefault),
setTimeout(statement,delay),clearTimeout(timer)–>
<form>
<input type="button" value="pop_button" onClick="alert(‘hello’)">
<input type="button" value="confirming_button"
onClick=" var reply = confirm(‘are you sure?’);
alert(reply)">
<input type="button" value="ask me a question"
onClick="var name=prompt(‘What is your name?’,’your name is here’)
alert(‘your name:’+ name)">
<br>
<input type="button" value="close pop-up window" onClick="winvar.close()">
<input type="button" value="close this winodw" onClick="window.close()">
<input type="button" value="stop counting" onclick="clearTimeout(timer); alert(‘time:’+countnumber)">
</form>
<a href="http://www.yahoo.com" target="winname">Bring my child to Yahoo</a>
see a new window?
</body>
</html>
Details:
In Script tag
1. ->maximum-scale=1.0;user-scalable=1.0;">
You can use properties like width(device-width), height(device-height), initial-scale, minimum-scale, maximum-scale, and user-scalable.
If you want to let web content representation equals to mobile , you can use this tag to help you figure out this problem.
2. -><body onLoad="alert(‘welcome’)" onUnload="alert(‘GoodBye’)"> (These two members are events.)
onLoad -> Browser will do things when user link to the page.
onUnload -> Browser will do things when user leave out the page.
3.
->function openURL(){
var url="https://www.google.com"
if(!window.winvar||winvar.closed) var winvar =window.open(url)
else winvar.location = url
}
function is our defined method to help us clearly execute specific content.
if is a condition judgement established that if will execute following statement and else will do other statement when condition is false.
When condition established, the openURL function meaning is open the URL pointed page when browser doesn’t define winvar this property or winvar opening window is closed.
4. -> function bt_details(this_bt){..
It will turns the argument property into corresponding parameter and print it out when the function is called.
5. -> function terminate(){..return false..
It will execute content until reaching the line which is “return false" and ending up when the function is called, so it just print “before".
6. -> function count(){..setTimeout(“count()",1000)}
count()
There is a setTimeout method which user links to browser and browser executes the count() function every one second.
In form tag part
7. ->onClick() is a useful method in button implementation which does things after clicking the button.
like
1-4. openURL, bt_details,terminate, alert(‘hello’),
If you put the function in the position after onClick method, browser will carry out the function content when user clicks the button.
alert: Showing a pop-up window with designated content.
5. " var reply = confirm(‘are you sure?’);alert(reply)",
confirm: Showing a pop-up window with confirm and cancel.
6. “var name=prompt(‘What is your name?’,’your name is here’) alert(‘your name:’+ name)"
prompt: Showing a guided text and submitting user’s input with prompted words.
7.winvar.close(),
close: it will close the designated element, in this case, it closes the other opening window.
8.window.close() -> close current window.
9.clearTimeout(timer); alert(‘time:’+countnumber)
clearTimeout: it will let previous calculating Timeout method valid.
portran 
發表留言