我需要使用 jQuery 附加一个 HTML 选择选项。我有一段代码,当单击下拉菜单时,它会通过 AJAX 获取子函数。完成此操作后,我还需要添加另一个选项标签,其值为 99 和其他子函数的文本。我的代码:
$.ajax({
type: "POST",
data: {function_id: function_id},
url: '<?php echo WEB_URL; ?>includes/ajax/target_audience_sub_functions.php',
dataType: 'json',
success: function(json) {
var $el = $("#target_audience_sub_function");
$el.empty(); // remove old options
$el.append($("<option></option>").attr("value", '').text('Please Select'));
$.each(json, function(value, key) {
$el.append($("<option></option>").attr("value", value).text(key));
});
$el.append($("<option></option>").attr("value", '99').text('Other sub function'));
}
});
$el.append
是我尝试用来添加其他选项标签的代码,但它不起作用。我只从 AJAX 中获取。顺便说一句,第一个追加也不起作用。
HTML
<div class="form-group">
<label for="target_audience_sub_function">Sub-Function</label>
<select data-selectedSubFunction="<?php echo (isset($audience)) ? $audience['target_audience_sub_function'] : ''; ?>" class="form-control light_grey_bg ta_sub_function" id="target_audience_sub_function" name="target_audience_sub_function[]">
<option value="">-- Choose sub function --</option>
<?php $get_functions = $db->get_all('sub_functions');
foreach ($get_functions as $function) { ?>
<option value="<?php echo $function['sub_function_id']; ?>" <?php echo isset($audience) ? $audience['target_audience_sub_function'] == $function['sub_function_id'] ? "selected='selected'" : "" : ''; ?> ><?php echo $function['sub_function_name']; ?></option>
<?php } ?>
</select>
</div>
最佳答案
你的代码应该可以工作,我刚刚尝试过,并且选择已按照你想要的方式填充。
var json = {
0: 'Hello',
1: 'Bobby'
};
$(function() {
var $el = $("#target_audience_sub_function");
$el.click(function() {
$el.empty(); // remove old options
$el.append($("<option></option>").attr("value", '').text('Please Select'));
$.each(json, function(value, key) {
$el.append($("<option></option>").attr("value", value).text(key));
});
$el.append($("<option></option>").attr("value", '99').text('Other sub function'));
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="target_audience_sub_function"></select>
也许成功回调从未执行,而您看到的选项是 PHP 打印的选项?
关于javascript - 需要使用 JQuery 附加到选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40156027/