Question

我正在为客户开发一个后端，我有一些<select />一起工作。具体来说，我有3 <select />用于选择国家，省和城市（西班牙），也适用于其他国家。

如果国家/地区中的所选选项为西班牙，则将填充省，如果选择省，则将填充城市。如果在国家/地区中选择了其他国家/地区，省和城市将保持禁用状态，但没有选项，但默认值为<option value="0">-- Select--</option>。

当选择国家/省/市时，进行ajax交易以获得结果。 PHP控制器解析结果，如果有结果（仅适用于西班牙），则返回此结果（填充省份）：

<option value="0" >-- Select --</option>
<option value="1" >Andalucía</option>
<option value="2" >Aragón</option>
<option value="3" >Asturias</option>
...

如果所选国家/地区没有结果，则控制器返回：

<option value="0" >-- Select --</option>

我的问题是：如果只有值为0的选项，添加一个attr（“disabled”，true），我该如何处理; ？

我的实际JavaScript代码：

$(document).ready(function(){
    $("select#codpais").change(function() {
        var codpais = $(this).val();

        if (0 != codpais) {
            $.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) {
                if (data) {
                    $("select#codauto").attr('disabled', false);
                    $("select#codauto").html(data);
                }
            });
        }
    });
});

问题是控制器总是返回数据，因为网站是双语的，有些用户需要看 - 选择 - 和其他 - Seleccionar - （如果也被禁用了。）

提前谢谢！

Answer 1

听起来你只需要在返回数据后检查是否只有一个选项然后禁用选择框，所以你要做的就是找到选项元素长度并禁用如果＆lt; = 1.所以在您的$.post功能只是：

$.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) {
    if (data) {
        var $sca = $("select#codauto");
        $sca.attr('disabled', false);
        $sca.html(data);
        if ($sca.find("option").length <= 1) {
            $sca.attr('disabled', true);
        }
    }
});

我还添加了选择器缓存以提高性能。

Answer 2

您可以尝试选择第二个选项，如果不存在，则可以将其删除。这是一个提醒两种情况的例子。

第一个包含许多选项的示例：http://jsfiddle.net/zwKup/

默认选项的第二个示例：http://jsfiddle.net/zwKup/1/

var checkSecond =$('select option:eq(1)').attr('value');
if (checkSecond == undefined ) {
    alert ('undefined here');}
else {alert(checkSecond)}

Answer 3

理想情况下，让您的AJAX请求返回一些JSON而不是原始HTML。

如果失败了，你仍然可以通过jQuery提供的DOM遍历函数查看$(data)，计算元素的数量。如果只有一个option，且其值为0，请将disabled设置为true而不是false。

Answer 4

$(document).ready(function(){
$("select#codpais").change(function() {
    var codpais = $(this).val();

    if (0 != codpais) {
        $.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) {
            $("select#codauto").html(data);
            if (data.length == 0) {
                $("select#codauto").attr('disabled', false);

            }else{$("select#codauto").attr('disabled', true);}
        });
    }
});

}）;

如果只有一个<option>和jQuery </option> </select>，则禁用<select>

4 个答案: