Solve the JS code to add alert () on the success of the implementation, do not add the wrong problem!

Source: Internet
Author: User

Problem:

  $ (document) in jquery. Ready (function () {}) calls two methods (1) to use AJAX requests to go back to the Library class method (2) When the page to use the book category to query the book return page, let book category Echo method. In the (2) method, if Add alert () can execute normally, remove the problem that alert () does not perform normally.

Solution Source

1<script type= "Text/javascript" >2         //Review Queries3         functionSeachsysbook () {4             //get the book category from the drop-down box5             varcategoryid=$ ("#categoryid"). Val ();6             //get the value of ISBN from the input box7             varisbnid=$ ("#isbnid"). Val ();8             //Remove both spaces9Isbnid=Mytrim (Isbnid);Ten             //Stitching Request Address One             if(categoryid!= "-1" | | Isbnid.length>0){ A                 varHrefs= "<%=request.getcontextpath ()%>/sys/querybook"; -                 if(categoryid== "-1" &&isbnid.length>0){ -hrefs=hrefs+ "? isbn=" +Isbnid; the                 } -                 if(categoryid!= "-1" &&isbnid.length<=0){ -hrefs=hrefs+ "? catid=" +CategoryID; -                 } +                 if(categoryid!= "-1" &&isbnid.length>0){ -hrefs=hrefs+ "? catid=" +categoryid+ "&isbn=" +Isbnid; +                 } Awindow.location.href=HREFs; at}Else{ -Alert ("Please select a book category or fill in the ISBN for Enquiry"); -             } -         } -          -         //customizing methods for removing whitespace at both ends of a string in         functionMytrim (str) { -             //a regular that matches a space from the left of a string to             varleft=/^\s*/; +             //a regular that matches a space starting at the end of a string -             varright=/\s*$/; theStr=str.replace (left, ""). Replace (right, ""); *             returnstr; $         }Panax Notoginseng          -         //load the book column, when the page is loaded, go to the background to load all of the book's category information, add to the drop-down box the         functionloadcategory () { + $.ajax ({ AType: "POST", theURL: "<%=request.getcontextpath ()%>" + "/sys/ajax/category/0/options", +DataType: "JSON", -Successfunction(data) { $                     varoptions=data["Options"]; $$ ("#categoryid"). HTML ("<option value=\" -1\ ">=== Please select ===</option>" +options); -                 } -             }); the         } -         Wuyi         //when a query method is triggered to return a qualifying result, this is the request condition for echoing the book classification the         functionEchocat () { -             //gets the ID of the requested book category from the request scope Wu             varCatid= "<%=request.getattribute (" catid ")%>"; -             if(catid!=NULL&&catid.length>0){ About                 //assigns the ID of the requested book category to the drop-down box, implementing the request condition Echo $$ ("#categoryid"). val (CATID); -             } -         } -          A         //page load finished loading +$ (document). Ready (function(){ the loadcategory (); -             //Delay Call this method to avoid a successful execution without alert $SetTimeout (echocat,500); the         }); the</script> the  the  - Page Finder in<ul class= "Toolbar1" > the<li><label> Book Classification </label> the<select class= "Select3" id= "CategoryID" > About</select> the</li> the<li class= "click" > theIsbn:<input type= "text" id= "Isbnid" class= "Dfinput" value= "${ISBN}" style= "width:120px;" /> +</li> -                    the<li><label>&nbsp;</label><input name= "" type= "button" class= "scbtn" value= "Query" onclick= " Seachsysbook (); "/></li>Bayi          the</ul>
View Code

Possible causes of this problem:

This typically occurs after the alert () code that requires the page element to enter a certain state to use, plus alert (), the equivalent of the page element has enough time to enter a certain state, if you determine that your code is not a problem, you can put alert () After the code is put into a setTimeout function, that is, stop for a while and then run the following code, should be no problem.

Workaround:

This article helps me to solve the thing that I have been bored with today--the this+settimeout used in the class. reproduced here.

SetTimeout (expression, delay time)
SetTimeout (expression, interaction time)
Delay Time/Interaction time is in Hao seconds (1000ms=1s)

SetTimeout executes an expression once after it has been delayed for a specified time after loading and executes only once
SetTimeout executes an expression once every specified time from loading, when it is executed

1, Basic usage:
Execute a section of code:
var i=0;
SetTimeout ("I+=1;alert (i)", 1000);
Execute a function:
var i=0;
SetTimeout (function () {I+=1;alert (i);},1000);

Note the differences between the two methods above are compared.

Here's another one to execute the function:
var i=0;
function Test () {
I+=1;
alert (i);
}
SetTimeout ("Test ()", 1000);
You can also do this:
SetTimeout (test,1000);

Summarize:
The prototype of settimeout is this:
Itimerid = Window.settimeout (Vcode, Imilliseconds [, Slanguage])

There are two forms of settimeout

SetTimeout (Code,interval)
SetTimeout (Func,interval,args)

Where code is a string
Func is a function.

Note that the meaning of "function" is an expression, not a statement.
For example, you want to perform a function periodically
function A () {
//...
}
can be written as
SetTimeout ("A ()", 1000)
Or
SetTimeout (a,1000)

Note here that the second form is a, do not write a (), remember!!!
Unfold, no matter what you write here, if it is a variable, it must be a variable pointing to a function, if it is a function, then its return value will be a function

2, using settimeout to realize the function of setinterval
The idea is simply to call in a function to execute itself, a bit like recursion
var i=0;
function Xilou () {
I+=1;
if (i>10) {alert (i); return;}
SetTimeout ("Xilou ()", 1000);
You can use this, too.
SetTimeout (xilou,1000);
}

3, using settimeout in the class
Finally to the point, in fact, in the use of the class you encounter problems are about this, as long as the solution of this problem on everything without worry.
Oh. Let's take a look at the analysis:

function Xilou () {
By West building Cold Moon www.chinacms.org
This.name= "Xilou";
this.sex= "Male";
this.num=0;
}
Xilou.prototype.count=function () {
This.num+=1;
alert (this.num);
if (this.num>10) {return;}
The following tests are in four ways, one in turn.
SetTimeout ("This.count ()", 1000);A: An error occurs when the following X.count () Call: The object does not support this property or method.
SetTimeout ("Count ()", 1000);B: Error display: Missing object
SetTimeout (count,1000);C: Error display: ' Count ' not defined
Here is the fourth by the West building Cold Moon www.chinacms.org
var self=this;
SetTimeout (function () {self.count ();},1000);D: Correct

}

var x=new xilou ();
X.count ();

Error Analysis:
A: This in fact refers to the Window object, not the current instance object
B: and C: Count () and count actually refer to a single function named count (), but can also be window.count (), because Window.count () can be omitted as count ()
D: The variable self points to the current instance object, so that the JS parsing engine does not confuse the "who" this refers to.

Anyway, although we know that this in settimeout ("This.count ()", 1000) refers to the Window object, it still does not understand why it is
Window Object ^_^ (a little dizzy ...)
So we can imagine how this settimeout is defined:
SetTimeout is a method of window, the full name is this: Window.settimeout ()
That's supposed to be defined like this:
Window.settimeout=function (Vcode, Imilliseconds [, Slanguage]) {
//..... Code
Return timer//Returns a marker
}
So when you pass this to settimeout (), it is, of course, the current object window to which it belongs.

Solve the JS code to add alert () on the success of the implementation, do not add the wrong problem!

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.