[英]jQuery empty select but not the first option
我在WordPress中使用jQuery AJAX加载两个下拉列表。 我将AJAX数据作为字符串获取,我只是将<option>
s附加到我的<select>
字段。 它工作正常。 但每次它都没有清除之前的追加。 所以它实际上是在添加重复选项。
所以我做了一个更改,我在<select>
字段中添加了empty()
:
jQuery.ajax({
type: 'POST',
url: ajaxurl,
data: {"action": "load_product",
"company_id": company_id
},
success: function (data) {
jQuery('#company-products').empty().append( data );
}
});
但是我默认在选择字段中有一个空值选项,它只是删除那个。
<select name="product" id="company-products" class="form-control" required>
<option value=""><?php _e( 'Select a product', 'textdomain' ); ?></option>
</select>
如何附加其他选项,但即使空( value=""
)也不为空。
请注意,我知道我可以从jQuery传递空字段,但出于翻译目的,我无法从那里传递它。 所以我想要一个使用jQuery的可靠解决方案,而第一个选项仍然存在。
我甚至尝试将其更改为:
jQuery('#company-products').not(':first-child').empty();
jQuery('#company-products').append( data );
它没有用,甚至没有附加任何东西。 :(
尝试使用nextAll()
- 删除空<option>
后的所有元素
var emptyOp = $('#company-products :first-child');
emptyOp.nextAll().remove();
emptyOp.after(data);
您还可以使用许多其他选择器,
$('#company-products :gt(0)').remove();
$('#company-products').append(data);
要么
$('#company-products :not(:first-child)').remove();
$('#company-products').append(data);
不要使用empty()
只需使用remove()
。
$('#company-products').children('option:not(:first)').remove();
希望这对你有用
如果你只是试着写怎么办?
<?php _e( 'Select a product', 'textdomain' ); ?>
从jQuery开始编写JS变量并传递给你的选项?
var selectOption = '<?php _e( 'Select a product', 'textdomain' ); ?>';
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.