1.Frequently Asked Questions(The following problem is based onJQuery1.5、HTML4、css2)
strutsnull, injsis equal toundefinedis equal tonull, and comparisontrueor
Whenfalse, you must include brackets, otherwise the results are wrong.
As for why, I don’t know. For example:
alert(“ruleId–undefined—“+ (ruleId == undefined));//outputtrue
alert(“ruleId–null—-“+ (ruleId == null));//outputtrue
Only value is equal to“”or
Atundefined, it passed toactionwill it be quiltstruts2The packaging of data in each of thejava(such asInteger、Long) Set tonull
Declaration of onejsvariables without assigning value, then it is at this time it isnullundefined。
If the value in the text box is not filled in, useJQueryThe value of acquisition is“”
If
One attribute ofdocument Objectis not worth it, useJQueryTheattrmethod is obtained“”
alert(“$(#sssssss) 2== ” + $(“#sssssss”));//even
The elements ofid=”sssssss”do not exist, as well asObjectinstead ofnull
var sendData = {};//sendData == Object, butsendData.length == undefined
2.//JQueryAdd focusing and lost focus
Focus event in
$(“#limitStuCount”).hover(function(){
setCheckbox($(“#limitStuCountRadio”),”checked”);
},function(){
if($(this).val() == “”) setCheckbox($(“#limitStuCountRadio”),””);
});
Juery:
$(“#id”).focus(function(){
});
Disorders:
$(“#id”).blur(function(){
});
But the text change event cannot be written like this:
$(“#id”).change(function(){
});
Text changes event can be written like this,propertychangeis a trigger event when attribute changes
$(“#id”).bind(“propertychange”,function() {
});
3.js array asdataAction,actionCan’t receive or saystrutsI don’t know how to deal with the array.
Some people say that the JS array is used asdataActionIsn’t it convenient? The answer cannot be passed like this, soactionCan’t receive or saystrutsI don’t know how to deal with the array.
can only pass through the form of setting in the form of a collection
Digital collection:data:{
“termSchoolCourseIdList[0]”: 1,
“termSchoolCourseIdList[1]”: 2
}
Object collection:data:{
lstStu[0].num:”1″,lstStu[0].name:”xy1″,
lstStu[1].num:”2″,lstStu[1].name:”xy2″,
lstStu[2].num:”3″,lstStu[0].name:”xy3″
}
4.5 5js、jsp、css、htmland other files The role of parameters after the address of the files:
First, the script does not exist, but is dynamically generated by the server, so it brings a version number to show the difference.
Second, the client cache thesecssorjsfile, so each time it is upgradedjsor
AftercssFile, change the version number, and the client browser will download the newjsorcssFile, the function of brushing cache. Everyone may sometimes find that the style is modified orjs, it does not change when it is refreshed, that is, the client has a cachecssorjsfile, so it is good for parameters!
The second case is the most, and it may exist at the same time.
5.JQueryeach
$.each(data.datas,function(i,item){
if(item.isCuur == 1 ){
currentTermId=item.id;
}
$(“#select_termId”).append(“<option value='”+item.id+”‘ >”+item.termName+”</option>”);
});
$(“.schoolElectiveCourseRow:checked”).each(function(index,domEle){//At this timedomEleYesdocument object instead ofJQueryobject
alert(“index == ” + index);
sendData[“termSchoolCourseIds[“+ index +”]”] = $(this).val();
});
JQuery eachIn the cycle,returnis just exiting the loop, not to end the entire execution process.
6.JQuery$.ajax();
JQuery$.ajax();
return trueorfalse, just giveajax()This method is a return value and will be executedajax()The code behind, is not forajax()abovefunctionReturn a value.
7. Prevent the default behavior of the element,
as follows:
//Disable the delete application button and set it to gray
var aObj = $(“#delete”+ sendData[“termSchoolCourseDto.ids[“+ i +”]”]);
aObj.attr(“class”,”grayFont”);
aObj.click(function (domEle){
domEle.preventDefault();//Block the default behavior of the element, here is cancellationataghrefevent
});
8.Browser compatibility problem:
8.1. Below i8, if the input tag is set to read only, the “retreat key” on the keyboard will make the browser directly return to the previous browse page
8.2.IE8 does not support $ (“# addcourtr”). Html (), can be used
TMPL () in<script id=“addCourseTr” type=“text/x-jquery-tmpl”></script>, such as::::$(“#addCourseTr”).tmpl()
Jquery.tmpl.min.js:
8.3. In IE8, the Change incident bound through Live will only be triggered after clicking on the page. You can use $ (“# ImportinputFile”). LIVE (“Change”, Function () {} ); Change to → $ (“#ImportinputFile”)..
8.4. Below I8, if the input tag is set to read only, the “retreat key” on the keyboard will make the browser directly return to the previous browse page
8.5 in
InIE8, ifinputvalueNo default value (that is,value=””orvalue=”xxx”),So usePure JS array Get the value of the element
When the value of, an error will be reported:SCRIPT5007: Unable to obtain unavailable ornull The attribute referenced “value”, such as:
①var classRooms = $( addCourseTBody.find(“input[name=’classRoom’]”) );
var classRoom = $.trim( classRoomObj.value );
if(isNotEmpty(classRoom) && classRoom.length >100){
alert(“Classroom length cannot exceed 100 characters!”);
classRoomObj.focus();
return;
}
①This method will report an error, classroomobj.value “script5007:Unable to obtain unavailable ornull The attribute referenced “value”
②var classRooms = $( addCourseTBody.find(“input[name=’classRoom’]”) );
var classRoomObj = $(classRooms[i]);
var classRoom = $.trim( classRoomObj.val() );
if(isNotEmpty(classRoom) && classRoom.length >100){
alert(“Classroom length cannot exceed 100 characters!”);
classRoomObj.focus();
return;
}//② This method of obtaining the value with jQuery objects is fine
9.JQueryBindingchangeevent problem
Change event ($ (). “By binding <input ID =” ImportinputFile “Type =” FILE “/> can only be triggered once, no matter whether upload fails or success, (Google, Firefoxy is the same .
can only be binded on the label: <input ID = “ImportFile” οNchange = “Javascript: $ (‘# ImportFilename’). Val (this.value)” “” “” “” “
10. cssmin-height attribute can only pass JSObjectives
The string numbers in
$(“.content_center”)[0].style.minHeight=Number(dataListHeight.substring(0,dataListHeight.length-2)) + 200+”px”;
11.js
Injs, if the “two string numbers (example ①)” are compared, there will be problems. The comparison is not the digital value, butascii code, can only be converted into numbers first and then compare. But if it is a number compared with a string number, there is no problem. For example:
①“100” < “9” == true;
②Number(“100”) < Number(“9”) == false。
③100< “9” == false。
Details:http://www.cnblogs.com/icerainsoft/p/3448161.html
12.JQuery Seleator “”>“and” “
$(“#xx > xxx”) indicate search#xxIn the next levelxxxelement,$(“#xx xxx”)is to find#xxxxxelement
13. JQuery attrandpropDifference and use
0
In the version ofJQuery1.6above,propcannot be set<img>srcProperties,attrYes.
(The information below comes from:http://www.jb51.net/article/41170.htm, respect for originality. .
jquery1.6 has a new method prop (), and has never been used. The official explanation has only one sentence: Get the attribute value of the first element concentrated in the matching element.
Everyone knows that some browsers only need to writeDisabled, checked, and some should write it as disabled = “disabled”, Checkd = “Checked”, for example, use ATTR (“Check”) to obtain the checkbox of Checkbox. “Check” but not selected for the acquisition value is undefined.
JQ provides a new method “PROP” to obtain these attributes, which is to solve this problem. In the past, when we used ATTR to get the Check attributes, we returned “Checked” and “”. Essence
So when will it be used?Attr (), when to use prop ()?
1. Add the attribute name. This attribute will take effect and should use prop ();
2. There are two attributes of True, FALSE, use prop ();
3. Others use ATTR ();
jquery upgrade, everyone should pay attention to this!
The following is the official suggestionAttr (), PROP () use:
Attribute/Property |
.attr() |
.prop() |
accesskey |
√ |
|
align |
√ |
|
async |
√ |
√ |
autofocus |
√ |
√ |
checked |
√ |
√ |
class |
√ |
|
contenteditable |
√ |
|
draggable |
√ |
|
href |
√ |
|
id |
√ |
|
label |
√ |
|
location ( i.e. window.location ) |
√ |
√ |
multiple |
√ |
√ |
readOnly |
√ |
√ |
rel |
√ |
|
selected |
√ |
√ |
src |
√ |
|
tabindex |
√ |
|
title |
√ |
|
type |
√ |
|
width ( if needed over .width() ) |
√ |
14. Aboutjsifexpression
If the expression of
14.1. ifis a string, an empty string (””)false, string length is greater than07
If the expression of
true。
14.2. ifis a number, greater than or less than less than09true, equal to01false。
var _recruitId = 0;
if(_recruitId){//equal to
If the expression offalse
alert(true);
}else{
alert(false);
}
14.3. ifisnullorundefined5false。
14.4. (“” == 0);//The result of the expression istrue。
14.5. When the stitching strings are stitched to stitch a expression of a expression, this expression should be included in parentheses.
For example:
alert(“ruleId–undefined—“+ (ruleId == undefined));//outputtrue, the object of comparison is Ruleid and UNDEFINED; if it does not add brackets, Alert (“Ruleid-Undefined —“+ Ruleid == Undefined);and
Boolean value in undefined
14.6. Js:“true” != true , but“true” == “true”, andpropSettings
When the value of the Boolean type ischecked、disabled, the second parameter must be a Boolean value instead of“Boolean string” (that is, it must be obj.prop (“Checked”, TRUE) instead of obj.prop (“Checked”, “true”))。
15. About
The function of the function in
js
If the function has3Parameters, you only pass the first two, this will not report an error, but the third parameter isundefined。
16. actionData conversion problem
16.1. No result defined for action xxx and result error Generally because ofjsonData conversion error, such as:
The object of the
servicelayer is also convertedjsonFormat backAJaxwill report this fault.
16.2. strutsnull, injs201 201 is equal toundefinedis equal tonull。
16.3. Only values equal to“”orundefined, passed toactionwill it be quiltstruts2The packaging of data in each of thejava(such asInteger、Long) Set tonull。
17. JsGet
The actual width method of
<img />:
bigImgObj = $(“.bigImg”);
bigImgObj.onload = function(){
// Get an array containing the actual width and height of the picture
widthAndHeightArray = getImgNaturalDimensions(bigImgObj);
console.log(widthAndHeightArray[0] +” , “+ widthAndHeightArray[1]);
};
function getImgNaturalDimensions($imgObj) {
var nWidth, nHeight,
imgDomObj = $imgObj[0];// Turn jQuery objects into DOM objects
if (imgDomObj.naturalWidth) { // Modern browser
nWidth = imgDomObj.naturalWidth;
nHeight = imgDomObj.naturalHeight;
} else { // IE6/7/8
var image = new Image();
image.src = imgDomObj.src;
nWidth = image.width;
nHeight = image.height;
}
return [nWidth, nHeight];
}