ユーザーがdivにあるコンボボックスをクリックすると、データベースへのajax呼び出しが発生します。divs クリック イベントを使用してコンボボックスを動的に設定しようとしています。IE8 で問題が発生しました (ff は正常に動作します)。データをクリックするとデータベースから取得されますが、コンボボックスはフォーカスを失い、コンボボックスをもう一度クリックして選択する必要があります。なぜこれが起こっているのかを調べようとしています。助けてくれてありがとう。これは、テーブルの td セグメントにある div です。
<div class="catagory"><select class="catagorycombo"><option value="3456">Select All</option></select></div>
<script type="text/javascript">
$('body').on('click', '.catagory', function(e){
var comboboxTest= $(this).parent().next("td").find('.testcombo');
var combobox = $(this).find('.catagorycombo');
var url = '<%= Url.Action("GetCatagoryListDropDown", "Document") %>';
var contextKey=combobox[0].options[0].value;
var text=combobox[0].options[0].text;
var length=combobox.prop('options').length;
if(text=="Select All" && length<=1)
{
combobox.empty();
combobox.append("<option value=\"" + contextKey + "\">Select All</option>");
combobox.append("<option value=\"loading\">Loading...</option>");
$.ajax({
type: "POST",
url: url,
data: { contextKey:contextKey },
success: function(data, textStatus, jqXHR) {
$.each(data, function(i, el) {
// combobox.append(new Option(el["Text"],el["Value"]));
combobox.("<option value=\"" + el["Value"] + "\">" + el["Text"] + "</option>");
});
combobox.find('option[value=loading]').remove();
}
});
}
else
{
return false;
}
});