Question

我遇到了jQuery show()函数的问题。我的代码在FF中工作得很好。我有一个组合在其更改事件上调用Ajax函数，此函数在beforeSend jQuery(selector).show()方法中使用以显示加载器。我不知道代码或我使用它的方式有什么问题。有人在我的代码中看到某种错误，或者在使用Chrome中的show()函数时对某些问题有所了解吗？

Html代码 -

<select class="coor_select required" id="coor_dpto" name="coor_dpto">
            <option value="" >Departamento</option>
            <?php foreach ($departamentos as $dpto): ?>
                <option value="<?php echo (string) $dpto->codigo ?>" ><?php echo $dpto->nombre ?></option>
            <?php endforeach; ?>
</select>

jQuery触发ajax函数

jQuery(document).on('change', '#coor_dpto', function() {
    var ciudades = get_ciudades_by_dpto('<?php echo $this->getAjaxUrl() ?>', '<?php echo $token; ?>', jQuery(this).val(), "#loaderCiudades");
    jQuery('#coor_ciudades_select_tpl_cont').html(template(ciudades));
});

Ajax功能

function get_ciudades_by_dpto(ajaxurl, param_token, dpto,loader_selector) {
var loader = typeof loader_selector !== 'undefined' ? loader_selector : "#loader";  

console.log(loader);
var templateData = '';
jQuery.ajax({
    dataType: 'json',
    type: 'POST',
    url: ajaxurl,
    async: false,
    data: {action: 'coor_ajax', functionaction: 'get_ciudades', token: param_token, cod_dpto: dpto},
    beforeSend: function( jqXHR) {
        //console.log('asdasd');
        jQuery(loader).show();
    },
    success: function(response) {

    },
    complete: function(jqXHR) {
       // console.log(jqXHR.responseJSON);
        jQuery(loader).hide('hide');
        var $ciudades = jqXHR.responseJSON;
        var ciudades = [];
        for (var i in $ciudades) {
            ciudades.push({codigo: $ciudades[i].codigo, nombre: $ciudades[i].nombre});
        }

        templateData = {
            ciudades: ciudades
        };
    }
});
return templateData;
}

你可以在coordinadora.spiderdigitalmarketing.com看到这个，在标题的手风琴中，第一个标签有＆＃34; Departamento＆＃34;组合

Answer 1

我稍微重写了我的代码，现在它正在运行。但是，我不知道为什么Chrome无法按预期执行第一个代码。我认为这是在发出ajax请求之前需要多长时间才能找到选择器的问题。

HTML代码 -

<select class="coor_select required" id="coor_dpto" name="coor_dpto">
        <option value="" >Departamento</option>
        <?php foreach ($departamentos as $dpto): ?>
            <option value="<?php echo (string) $dpto->codigo ?>" ><?php echo $dpto->nombre ?></option>
        <?php endforeach; ?>
</select>

jQuery触发ajax函数 -

jQuery(document).on('change', '#coor_dpto', function() {
    var opciones={
        ajaxurl:'<?php echo $this->getAjaxUrl() ?>',
        token:'<?php echo $token; ?>',
        dpto:jQuery(this).val(),
        handletemplate:template,
        container:jQuery('#coor_ciudades_select_tpl_cont'),
        loader:jQuery("#loaderCiudades")
    };
    get_ciudades_by_dpto(opciones);
    //jQuery('#coor_ciudades_select_tpl_cont').html(template(ciudades));
});

Ajax功能

function get_ciudades_by_dpto(opciones) {
var templateData = '';
jQuery.ajax({
    dataType: 'json',
    type: 'POST',
    url: opciones.ajaxurl,
    async: true,
    data: {action: 'coor_ajax', functionaction: 'get_ciudades', token: opciones.token, cod_dpto: opciones.dpto},
    beforeSend: function( jqXHR) {
        jQuery(opciones.loader).show();            
    },
    success: function(response) {
        //console.log(response);
        jQuery(opciones.loader).hide();
        var $ciudades = response;
        var ciudades = [];
        for (var i in $ciudades) {
            ciudades.push({codigo: $ciudades[i].codigo, nombre: $ciudades[i].nombre});
        }
        templateData = {
            ciudades: ciudades
        };            
       opciones.container.html(opciones.handletemplate(templateData)); 
    }

});

}

jQuery show函数不适用于chrome

1 个答案: