【问题标题】:ipad disable select options w/o jqueryipad 禁用选择选项 w/o jquery
【发布时间】:2012-03-29 03:14:51
【问题描述】:

有一种方法、插件或代码 sn-p 可以用来制作

<select><option disable="disable">....</option></select>

要禁用 ipad 上 safari 中的选项?

后期编辑:这里是代码:

     function getSelectedValues(ids) {

    var selectedValues = []
    , $selected = $('.selector').children('option:selected');       

    $selected.each(function(){  
        if(this.value != 0){
            if(ids == true){
                selectedValues.push(this.value+'-'+$(this).parent().attr('id'));
            } else {
                selectedValues.push(this.value);
            }
        }           
    });     
    return selectedValues;  
}


function clearDisabled() {
    $('.selector').children(':disabled').attr('disabled', false);
}

function disableSelected(selectedValues,id) {

    sv = selectedValues || [];

    if(id === true){
        var selectedIds  = [];
        var selectedVals = [];

        $.each(selectedValues, function(key, value) { 
            values = value.split('-');

            selectedVals.push(values[0]);
            selectedIds.push(values[1]);

        });

        for (var i=0;i<selectedVals.length;i++) {
            $('.selector').each(function(){
                if($(this).attr('id') == selectedIds[i]){
                    $('option[value=' + selectedVals[i] + ']',this).not(':selected').attr('disabled', true);
                }
            });
        }
    }
}

$(document).ready(function(){
    $('.selector').change(function(){
        selectedValues = getSelectedValues(true);
        clearDisabled();
        disableSelected(selectedValues, true);
    });

    var selectedValues = getSelectedValues(true);
    disableSelected(selectedValues, true);
});

我做了一些挖掘,我意识到这是 safari mobile 的限制......

【问题讨论】:

    标签: jquery html ipad jquery-plugins jquery-selectors


    【解决方案1】:

    跨浏览器实现更复杂,iPad 和 iPhone 的 safari,ie6,我认为其他浏览器只是忽略禁用的选项。

    您需要删除它们。因此,请保留它的副本并随时重建选项。

    这是一个示例,您可以根据它们的值启用/禁用选项

    var $select = $("select#myselect");
    $select.data("copy", $select.find("option"))
    
    function disableOption($option) {
      var optionVal = $option.val();
      $select.empty()
      $select.data("copy").each(function(){
        var $currentOption = $(this);
        if (optionVal !== $currentOption.val() && $currentOption.attr("disabled")!=="disabled") $select.append($currentOption);
        else $currentOption.attr("disabled", "disabled");
      });
    }
    
    
    function enableOption($option) {
      var optionVal = $option.val();
      $select.empty()
      $select.data("copy").each(function(){
        var $currentOption = $(this);
        if (optionVal === $currentOption.val()) $currentOption.removeAttr("disabled")
        if ($currentOption.attr("disabled")!=="disabled") $select.append($currentOption);
      });
    }
    

    【讨论】:

      【解决方案2】:
      $("select option[disable='disable']").attr("disabled","disabled");
      

      或者如果您使用的是 jquery 1.6 或更高版本

        $("select option[disable='disable']").prop("disabled",true);
      

      【讨论】:

      • 我是这样做的,在 pc 版上运行完美,但在 ipad 上,禁用的选项仍然显示在选择中
      猜你喜欢
      • 1970-01-01
      • 2012-07-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-10-22
      • 2011-06-17
      • 2011-01-27
      • 1970-01-01
      相关资源
      最近更新 更多