Question

首次点击时，我想重新填充select元素。起初我只显示“B”元素。单击它时，它将重新填充列表并选择“B”。问题是它无法正常工作。当我点击它时，它只显示一个元素“A”。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">

  <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>
  <script type='text/javascript' src="http://datatables.net/release-datatables/media/js/jquery.dataTables.min.js"></script>

<script type='text/javascript'> 
$(document).ready(function() {

    var select = "<option value=\"A\" class=\"op\">A</option><option value=\"B\" class=\"op\">B</option><option value=\"C\" class=\"op\">C</option>";
    var selected = "B";
    $("#test").click(function() {           
        var size = $(this).find("option").size();
        if(size == 1) {             
            //$(this).empty();
            $(this).children().remove().end().append(select);
            $(this).val(selected);

            $("#test option").filter(function() {
                return $(this).text() == selected; 
            }).prop('selected', true);

        }
    });

});
</script>


</head>
<body>

SELECT ELEM
<select id="test">
    <option value="B" class="op">B</option>
</select>
</body>
</html>

单击时重新选择选择

0 个答案: