Question

我有以下代码：

 render: function (data, type, product) {
                            var s = $('<select id="qty_dropdown" />');
                            for (i = 1; i <= data; i++) {
                                $('<option />', { value: i, text: i }).appendTo(s);
                            }
                            $('#qty_dropdown>option:eq('+data+')').prop('selected', true);
                            return s.prop("outerHTML");

                        }

我只是试图设置选定的值= data。但是，这将显示第一个选项值，而不是最后一个选项值。因此，例如，如果data == 10，则下拉列表将显示1而不是10。

Answer 1

由于您要选择的元素是最后一个元素，因此可以对其进行更新。

var data = 10;
var s = $('<select id="qty_dropdown" />');
for (i = 1; i <= data; i++) {
  $('<option />', {
    value: i,
    text: i
  }).appendTo(s);
}
//You need to perform the find on the `s` element, not on the page
s.find('option:last').attr('selected', true);
console.log(s.prop("outerHTML"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

您可以尝试以下方法：

$('#qty_dropdown option[value="'+data+'"]').prop('selected', true)

Answer 3

由于下拉列表是一个新创建的元素，并且它不是DOM的一部分，因此您无法使用：

$('#qty_dropdown>option:eq('+data+')').prop('selected', true);

您可以使用变量：

s.find('option:eq('+(data-1)+')').prop('selected', true);

您需要使用数据-1 ，因为下拉菜单中的选项从0到n -1

无论如何，在下拉菜单中选择选项的最简单方法是.val()：

var data = 10;

var s = $('<select id="qty_dropdown" />');
for (i = 1; i <= data; i++) {
    $('<option />', { value: i, text: i }).appendTo(s);
}
s.val(data);
// just to see ...
s.appendTo('body');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如何在下拉菜单中设置默认值

3 个答案: