IE8 html select needs two clicks to open dropdown

2019-03-06 01:29发布

Here is my code.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<style type="text/css">
div {
    background-color: silver;
    border: 1px solid black;
    width:200px;
}
</style>
<script>
    $(function() {
        $("#click").dblclick(function(e) {
            var options = "<select id='combobox'>"
            for ( var i = 0; i < 50; i++) {
                options += '<option value="ActionScript">Value - ' + i + '</option>';
            }
            $(this).html(options + "</select>");
        });
    });
</script>
</head>
<body>
    <div id="click">double click me</div>
</body>
</html>

After double clicking on div, a select element is rendered in the div. The problem is in IE8 after select is rendered, it needs two clicks to open the dropdown menu. It should be opened in a single click.

2条回答
我只想做你的唯一
2楼-- · 2019-03-06 01:52

At this moment I don't have an IE8 Please try to add $('#click').unbind('dblclick'); after create select element, it will dissable #click dblclick event.

$(function() {
     $("#click").dblclick(function(e) {
          var options = "<select id='combobox'>"
          for ( var i = 0; i < 50; i++) {
               options += '<option value="ActionScript">Value - ' + i + '</option>';
          }

          $(this).html(options + "</select>");
          $('#click').unbind('dblclick');
     });
});
查看更多
Deceive 欺骗
3楼-- · 2019-03-06 02:03

Finally I have found this solution. I have use jQuery appendTo as in $(options + "</select>").appendTo(this); method instead of .html as in $(this).html(options + "</select>"); .

查看更多
登录 后发表回答