通过JQuery和Ajax Chrome Issue附加选择选项

时间:2016-12-16 03:10:29

标签: jquery ajax google-chrome select

我正在使用Jquery和Ajax来为选择框填充新选项。我使用焦点来捕捉鼠标点击以及' tab'键盘选择。一切顺利。我已经在FF和chrome中测试了代码,第二个浏览器似乎隐藏了新选项,只有在点击两次时才显示它们。

代码看起来像这样:

//select licensee
$("#licensee_id").focus(function () {
    var customer_data = $("#customer_data").val();

    var pickup_date = $("#pickup_date").val();
    var pickup_hour = $("#pickup_hour").val();
    var pickup_minute = $("#pickup_minute").val();

    var dropoff_date = $("#dropoff_date").val();
    var dropoff_hour = $("#dropoff_hour").val();
    var dropoff_minute = $("#dropoff_minute").val();

    var pickup_location_id = $("#pickup_location_id").val();
    var dropoff_location_id = $("#dropoff_location_id").val();

    var deliver_model_code = $("#deliver_model_code").val();

    if( !customer_data || !pickup_date || !pickup_hour || !pickup_minute || !dropoff_date || !dropoff_hour || !dropoff_minute || !pickup_location_id || !dropoff_location_id || !deliver_model_code )
    {
        $("#licensee_error").html('<div class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> Please fill-in all the required order details</div>');
    }
    else
    {
        $("#licensee_error").html('');
        $.ajax(
        {
            url: 'find-licensee.php',
            type: 'GET', 
            contentType: "application/json; charset=utf-8", 
            dataType: 'json', 
            data: 
            {
                customer_data: customer_data, 
                pickup_date: pickup_date, 
                pickup_hour: pickup_hour, 
                pickup_minute: pickup_minute, 
                dropoff_date: dropoff_date, 
                dropoff_hour: dropoff_hour, 
                dropoff_minute: dropoff_minute, 
                pickup_location_id: pickup_location_id, 
                dropoff_location_id: dropoff_location_id, 
                deliver_model_code: deliver_model_code
            }, 
            success:function(data) 
            {

                $('#licensee_id').empty();
                //$('#licensee_id').append($('<option>').text("Select..."));
                $("<option></option>", {value: "", text: "Select..."}).appendTo('#licensee_id');
                $.each(data, function(i, obj)
                {
                    //$('#licensee_id').append($('<option>').text(obj.name).attr('value', obj.id));
                    $("<option></option>", {value: obj.id, text: obj.name}).appendTo('#licensee_id');
                });

                //$('#licensee_id').attr('size', value);

            }
        });
    }
});
//select licensee

Json Array看起来像这样:

[{"name":"INTERNETi2","id":"8"},{"name":"INTERNETi","id":"7"}]

Firefox结果:

enter image description here

Chrome结果:

enter image description here

第二次点击一切看起来很好...... 有什么方法可以解决这个问题吗?

任何帮助将不胜感激,我尝试了一切,但我取得了成功...

提前谢谢。

0 个答案:

没有答案