jQuery在ajax成功回调中被忽略了

Question

我正在使用jQuery和Ajax来填充选择。现在我试图在成功回调中做到这一点，但它被忽略了

奇怪的部分是我的console.log（'test'）;正在我的成功回调，但我的DOM操作不是。我的DOM操作在成功回调之外工作。

对我来说似乎很神奇。这是代码

$(document).ready(function(){

// This is working
//$('select[name="service"]').append('<option selected="selected" value="1">Test</option>');

$('select[name="region"]').change(function(){
    $.ajax({
        type: "GET",
        url: "ajax/updateServices.php",
        data: "region=" + $(this).val(),
        dataType: "html",
        success: function(data){
            // this is also working
            console.log('test');
            // This is being ignored
            $('select[name="service"]').append('<option selected="selected" value="1">Test</option>');

        }
    });
});

}）;

修改

似乎selectize.js导致了这个问题。我将研究为什么selectize.js会造成这种情况。

Answer 1

我会用select插件分享我的历史： 一些选择插件（如SelectBox）要求你在再次填充选择或更改任何内容之前销毁jquery对象，甚至是selectedIndex你需要再次声明select作为select-plugin 例如（使用selectBox，但在其他人的工作方式相同）

$("#MySelect").selectBox('destroy')
$("#MySelect").append("<option>New Option </option>");
$("#MySelect").selectBox()

另外，确保在调试时，$('select[name="service"]')返回所需的select而不是空对象，大多数问题在调试模式下解决（不使用调试模式？使用Source选项卡下的Chrome Developer工具）。 / p>