Effect of Null value on page page on browser compatibility

Source: Internet
Author: User

Web page effect of page null value on browser compatibility


There is a browser compatibility issue with input radio on one of the pages in the recent project.

Problems:

In the Google Browser, 360 haste mode and Sogou haste mode in the initial dynamic assignment to radio, the checked property is invalid, cannot be selected. Note: The360 haste mode and Sogou haste mode use the Google Chorme kernel (also known as the WebKit kernel).

The checked property is checked correctly when radio is assigned to the initial dynamic in Firefox.

My colleague thought it was a browser compatibility problem, and I always failed to solve the problem, and later this bug was left to me to modify.

Initial to the task, but also suspected browser compatibility issues, but then carefully think, Google so cowhide technical strength, the odds should be relatively small, then from the code itself to find the problem. Later found that there is an El expression value appended with a null value, affecting the selection of radio, the browser is not compatible with the bug.

Summing up lessons learned, it is necessary to judge Null values, especially if jquery does not prompt for implicit errors in the page.

Give the block of code to the problem first. The main function is to select whether radio is selected based on background parameters .

<%--<c:choose> <c:when test= "${gj.notmodelbad== ' 1 '}" > <in Put type= "Radio" name= "Nobad" value= "1" checked= "checked" style= "MARGIN-LEFT:18PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" style= "M argin-left:112px;font-size:14px; " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > On-Site analytical components are normal, not our module issues </label> </c:when> <c:when test= "${gj.notmode lbad== ' 2 '} "> <input type=" Radio "name=" Nobad "value=" 1 "style=" margin-left:18px " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" checked= "Checked" style= "MARGIN-LEFT:109.5PX;FONT-SIZE:14PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Field Analysis PartsNormal, non-module issues </label> </c:when> <c:otherwise> <input type= "Radio" name= "Nobad" value= "1" style= "MARGIN-LEFT:18PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" style= "M argin-left:112px;font-size:14px; " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > On-Site analytical components are normal, not our module issues </label> </c:otherwise> </c:choose>--%>
the value of El expression ${gj.notmodelbad} may be empty and needs to be processed.

My solution: Add jquery to dynamically assign values based on background parameters.

<div> <c:choose> <c:when test= "${gj.badtype== ' 2 '}" > & Lt;input type= "checkbox" value= "2" id= "NOMD" checked= "checked"/> </c:when> <c:              otherwise> <input type= "checkbox" id= "NOMD" value= "2"/> </c:otherwise> </c:choose> <label><strong> non-module bad </strong></label><table clas s= "Bdrighttab" ><tr><td style= "width:100px;" ><input id= "NobadRad1" type= "Radio" name= "Nobad" value= "1" style= "margin-left:112px;"/><labelstyle= " margin-left:5px;font-size:14px; " > Information description does not match, cannot judge </label><br/><input id= "nobadRad2" type= "Radio" name= "Nobad" value= "2" style= " margin-left:112px;font-size:14px; "/><labelstyle=" MARGIN-LEFT:5PX;FONT-SIZE:14PX; " > On-site Analysis of components normal, non-Division I module problems </label><input type= "text" style= "Background-color: #e4e4e4; border-style:solid; Border-coloR: #B0B0B0; border-width:thin; " class= "Otherreason" value= "${gj.otherreason}"/></td></tr><%--<c:choose> &lt ; C:when test= "${gj.notmodelbad== ' 1 '}" > <input type= "Radio" name= "Nobad" value= "1" checked = "Checked" style= "MARGIN-LEFT:18PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" style= "M argin-left:112px;font-size:14px; " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > On-Site analytical components are normal, not our module issues </label> </c:when> <c:when test= "${gj.notmode lbad== ' 2 '} "> <input type=" Radio "name=" Nobad "value=" 1 "style=" margin-left:18px " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" checked= "Checked" style= "MARGIN-LEFT:109.5PX;FONT-SIZE:14PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;"                         > On-site Analysis of components normal, non-module issues </label> </c:when> <c:otherwise> <input type= "Radio" name= "Nobad" value= "1" style= "MARGIN-LEFT:18PX;" /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > Information description does not match, cannot judge </label><br/> <input type= "Radio" name= "Nobad" value= "2" style= "M argin-left:112px;font-size:14px; " /><label style= "MARGIN-LEFT:5PX;FONT-SIZE:14PX;" > On-Site analytical components are normal, not our module issues </label> </c:otherwise> </c:choose>--%>& Lt;/table></div> </div>

jquery Dynamic Assignment:

      $ (document). Ready (function () {  var Notmodelbad = ${gj.notmodelbad};if (notmodelbad== ' 1 ') {$ ("#nobadRad1"). attr (" Checked ", true); $ (" #nobadRad2 "). attr (" checked ", false);} else if (notmodelbad== ' 2 ') {$ ("#nobadRad1"). attr ("checked", false); $ ("#nobadRad2"). attr ("Checked", true);});  

The. Do method in the background

Market Parallel Interactive @RequestMapping ("mamutualgd.do") public String MAMUTUALGD (httpservletrequest request, Httpservletrespon SE response) throws Exception {String type = Request.getparameter ("type"); int marketjiaohuid = Integer.valueof ( Request.getparameter ("id")); String Vcode = string.valueof ((Request.getparameter ("Vcode")); String date_from1 = string.valueof ((Request.getparameter ("Datfrom")); String date_to1 = string.valueof ((Request.getparameter ("Datto")); Getcurrentinfo (type, Vcode, date_from1, date_to1); list<odspapptgongdan> odspapptgongdandtolist = Qualityperformanceservice.getodspapptgongdandtolist (); list<odspapptgongdan> gdlist = new arraylist<odspapptgongdan> (); list<odspapptgongdan> gdcloselist = new arraylist<odspapptgongdan> (); for (Odspapptgongdan G:    Odspapptgongdandtolist) {if (G.getjiaohustatus (). Equals ("4")) {Gdcloselist.add (g);    } else {Gdlist.add (g); }}odspapptgongdan gd = new Odspapptgongdan (), if (type.substring (1, 2). Equals ("0")) {   GD = Gdlist.get (Marketjiaohuid); Request.setattribute ("GD", GD);}    else {gd = Gdcloselist.get (Marketjiaohuid); Request.setattribute ("GD", GD);} Gongdanbadjiaohu GJ = Qualityperformanceservice.getgdjiaohuinfo (Gd.getgdcode (), Gd.getzyaccount ()); Gj.getchangestatus () = = NULL | | Gj.getchangestatus () = = "") {Gj.setchangestatus ("0");} if (Gj.getnotmodelbad () = = NULL | | Gj.getnotmodelbad () = = "") {Gj.setnotmodelbad ("0");} System.out.println ("Changestatus:" + gj.getchangestatus ()); System.out.println ("Notmodelbad:" + Gj.getnotmodelbad ()); Request.setattribute ("GJ", GJ);// Request.getrequestdispatcher ("userevaluation.jsp"). Forward (request,//response); return "pages/usersevaluation/    Usermutual "; }

the effect after processing:


Add, this problem also has a simple processing way, is to use the picture instead of radio, select or uncheck, change two picture to line.
Although the problem code is not written by me, but also reminds me of the importance of Java null processing, I must write code in the future to add null judgment, and sometimes we encounter most of the null pointer exception, basically is uninitialized caused by the null value exception.




Effect of Null value on page page on browser compatibility

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.