Question

我有以下问题，希望有人能告诉我问题出在哪里..

我的表单有3个州，城市和社区选择选项。最后2个选择取决于它之前的一个值。一切都很好，但需要2秒钟来显示新选项（在上一个选择中更改后）。我知道这里不需要json（对吗？）..但有没有办法减少响应时间？

function carga(tipo, valor, selector){
    $.ajax({
        type: 'post',
        url: "include/sel.php",
        data: { tipo: tipo, valor: valor },
        error: function() {
            $(selector).html('<option>Ha ocurrido un error</option>');
      },
        success: function (response) {
            $(selector).html(response);
        }
    })

}

编辑：我忘了..我正在使用xampp

这是我的sel.php

include('dbcs.php');

$i = $_POST['tipo'];
$valor = $_POST['valor'];

switch($i){
case 'provincia':
    $consulta_sql = 'Select * from tbl_zona_provincias';
    break;
case 'partido':
    $consulta_sql = 'Select idPartido, partido from tbl_zona_partidos Where codProvincia = "'.$_POST['valor'].'"';
    break;
case 'localidad':
    $consulta_sql = 'Select idLocalidad, localidad from tbl_zona_localidades Where idPartido = "'.$_POST['valor'].'"';
    break;
}


if(!$resultados = $db->query($consulta_sql)){
die('Se produjo un error al intentar enviar la consulta [' . $db->error . ']');
} else {

while($row = $resultados->fetch_array()){
    if($i == 'provincia'){
        $option = '<option value="'.$row['codProvincia'].'">'.$row['provincia'].'</option>';
    } else if($i == 'partido'){
        $option = '<option value="'.$row['idPartido'].'">'.$row['partido'].'</option>';
    } else {
        $option = '<option value="'.$row['idLocalidad'].'">'.$row['localidad'].'</option>';
    }
    echo $option;   
}
$resultados->free();
}
$db->close();

Answer 1

如果您在开始时以多维数组存储所有州，城市和地区，您将减少治疗时间。该数组可以采用以下结构：

在PHP中

$selectOptions = array(
     state_id => array(
          country_id =>array(
               'name'=>country_name,
               'content'=>array(
                      neightborhood_id => neightborhood_name,
                 ),
             ),
           country_id...
        )
    ),
     state_id...
);

并在您的页面

<script ...>
    var selectOptions = <?php echo json_encode($selectOptions)?>;
</script>

然后，对于州列表，请执行

$('#stateselector').on('change', function() {
    $('#countrySelector').empty();
    $(selectOptions[$(this).val()]).each(function(id, value) {
      $('#countrySelector').append($('<option />').attr('value', id).text(value.name));
    }
}

对于国家/地区列表，请执行

$('#countryselector').on('change', function() {
    $('#neightborhoodSelector').empty();
    $(selectOptions[$(stateselector).val()][$(this).val()]).each(function(id, value) {
      $('#neightborhoodSelector').append($('<option />').attr('value', id).text(value));
    }
}

ajax帖子（没有Json）占用太多

1 个答案: