Bug in JQuery operating Select's Options (IE8 compatibility view mode)_jquery

Bug scene:

Viewed through the developer tools, the drop-down list box has Options, but nothing is displayed when you click to select.

Steps to reproduce :
This problem occurs in cascading drop-down boxes. When the first list changes, the value of the second list changes accordingly!
In this example, the following method is used to bind data:

Copy code The code is as follows:

//Bind drop-down box
//ctnSelector: drop-down box ID, with #,
//jsonData: JSON data,
//txtField: text field name,
//valField: Value field name,
//strOptions: items added by default
function InitSelectOptions(ctnSelector, jsonData, txtField, valField, strOptions) {
if ($(ctnSelector).length == 0) { return false; };
$(ctnSelector).html('');
var optList = strOptions;
if (typeof (jsonData) != undefined) {
for (var jitem in jsonData) {
if (jitem == "insertAt" || jitem == "removeAt" || jitem == "moveTo") {
continue; //Solve the problems caused by flareJ.Base.js.
}
optList = "" jsonData[jitem][txtField] "";
}
}
$(ctnSelector).html(optList);
}

No problem when loading normally!
But because the value of the first drop-down box changes and the options in the second drop-down box are cleared,
then you still click on the second drop-down box to try to select an item,
Go and change the options of the first drop-down box.
You will find that the items previously displayed in the second drop-down box that correspond to the first drop-down box cannot be displayed.
can only be displayed. The first one, or set to the selected one via script!

Solution:
Use DOM method to operate Options, the code is as follows:

Copy code The code is as follows:

//Bind drop-down box
//ctnSelector: drop-down box ID, with #,
//jsonData: JSON data,
//txtField: text field name,
//valField: value field name,
//strOptions: items added by default
function InitSelectOptions(ctnSelector, jsonData, txtField, valField, strOptions) {
if ($(ctnSelector).length == 0) { return false; };
$(ctnSelector).empty();
var sel = $(ctnSelector).get(0);
var newOpt = $(strOptions);
var newOption1 = document.createElement("OPTION");
newOption1.text = newOpt.text();
newOption1.value = newOpt.val();
sel.options.add(newOption1);
if (typeof (jsonData) != undefined) {
for (var jitem in jsonData) {
if (jitem == "insertAt" || jitem == "removeAt" || jitem == "moveTo") {
continue; //Solve the problems caused by flareJ.Base.js.
}
var newOption = document.createElement("OPTION");
newOption.text = jsonData[jitem][txtField];
newOption.value = jsonData[jitem][valField];
sel.options.add(newOption);
}
}
}