为什么jQuery hide()/ show()破坏HTML中的HTML选择?

前端之家收集整理的这篇文章主要介绍了为什么jQuery hide()/ show()破坏HTML中的HTML选择?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在编写jira-plugin,我需要在创建问题屏幕上编辑customfield.我使用jQuery来做到这一点.我在Chrome浏览器中使用html选项时使用的jQuery hide / show方法存在问题(在Firefox下运行良好).问题是我有3个不同的选择框,这些选项取决于前一个选项中选择的选项.我有一个功能,可以在前一个选择列表发生变化时准备下一个选择列表.

function prepareList(code,list) {
    list.children('option').each(function() {
        if(jQuery(this).text() == code || jQuery(this).text() == 'None') {
            jQuery(this).show();
        }
        else {
            jQuery(this).hide();
        }
    });
}

code是一个字符串,它是jQuery(‘#prevIoUs_select option:selected’).text()
它在许多情况下工作正常,但有时它会调整选项列表的大小.更糟糕的是,当下一个列表只有一个选项时,它不会显示.我可以看到它有显示:在HTML代码中内联,但在我点击选择三角形后,下拉列表就像2 px.
有趣的是,它在Firefox中完美运行.
IE 8甚至没有隐藏/显示,但它只是IE,所以我可以理解这一点.
Opera 12.16也没有隐藏/显示.
用于Windows的Safari 5.1.7也没有隐藏/显示.

问题是我应该使用哪些方法来实现我的目标?我也尝试了jQuery(this).css(‘display’,’none / inline’),它也不起作用.

编辑:
JSFiddle:jsfiddle.net/7KRLE/

最佳答案
$('#tier3').attr('disabled',true);

要禁用选项元素,必须将其disabled属性设置为字符串’disabled’,而不是布尔值true.

这给你:

$('#tier3').attr('disabled','disabled');

要启用它:

$('#tier3').attr('disabled','');

要么

$('#tier3').removeAttr('disabled');

IE和许多其他浏览器行为安全,不允许隐藏用户的选项.
关于IE的其他特殊处理,请阅读this article.

猜你在找的HTML相关文章