Objective:
This is an old bug and now offers a perfect solution. Since I have been using createelement to create dynamic option and add, so I have not encountered this problem, but everyone write code style is different, some people like to write a string of tags and innerhtml insert, this is not a problem, In order to facilitate people with different coding styles, I encapsulate a method for solving IE's bug and compatibility with 5 big browsers, so that everyone can use a method to achieve different styles, easy maintenance and management.
Bug Description:
Using innerHTML below IE to insert option options, IE will remove the front <option>, and split into multiple nodes, which will cause a select error, not not inserted, but the node in the conversion problem, Microsoft has a description of the bug , and provides two solutions, you can search for their own, I would like to mention Microsoft's two programs.
1, the use of createelement, this is a regular channel, to make a mistake there is really a problem.
2, insert the full select string into the div.
Realize:
Principle:
Since it is the person who uses innerHTML, you must want to insert option with a string, this is mainly to solve this person's population, of course, you can also pass the CreateElement object to insert.
For the incoming parameter will make a judgment, see is Elementobj or string, if it is elementobj then use the standard Add method to join, and do compatibility processing. If it is a string, use div to wrap the full select and convert it into a DOM object to join with AppendChild.
Attention:
B$.type.iselement (Arg) is a method within Bbank to determine whether an object is an element
B$.browser.isie () is the bbank inside to determine whether IE is the way
B$.parsedom (str) is a way to convert a string into a standard DOM in Bbank, which is specifically explained in my previous blog
Bbank Framework Introduction: http://www.cnblogs.com/bruceli/archive/2010/04/15/bBank.html
Copy Code code as follows:
var Sltobj=document.getelementbyid (' xx ')//Get Select object, here just give an example, you can get by your own custom
function addoption (obj, arg) {
if (B$.type.iselement (ARG)) {
if (B$.browser.isie ()) Obj.add (ARG);
else Obj.add (ARG, NULL);
Return
}
var str = ' <select> ' + arg + ' </select> ';
var SLT = b$.parsedom (str) [0];
for (var i = 0, num = slt.length i < num; i++) {
Obj.appendchild (Slt[0]);
}
};
Use:
Copy Code code as follows:
AddOption (sltobj, ' <option>a</option> ');
End
Here is the end, here to recommend a my own written JS framework, the above method is integrated in the framework of the
Use: b$ (' obj '). AddOption (ARG);