option元素 display属性在IE下无效的解决方法

最新推荐文章于 2023-01-02 21:27:42 发布

凡夫俗子Z

最新推荐文章于 2023-01-02 21:27:42 发布

阅读量3.5k

点赞数

分类专栏： web前端开发文章标签： option diaplay 无效 select

本文链接：https://blog.csdn.net/u012499210/article/details/53303154

版权

web前端开发专栏收录该内容

42 篇文章 0 订阅

订阅专栏

在做项目中有个区域和街道的联动效果，选择地区后过滤对应的街道。我刚开始时使用的方法是将option设置成 display:none,结果在IE下无效。

解决方法:

一. 用一个变量保存所有街道的值，过滤的时候取出来，动态添加到select中

二、用jquery的 $.wrap方法在option外面添加一个父元素通过父元素控制option的隐藏

三、每次当区域改变时向服务器发出请求加载阶段数据

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

凡夫俗子Z

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

动态添加select的option

Jacey's Blog

10-22

771

首先是定义的select元素： //根据ID获得select元素 var mySelect = document.getElementByIdx_x("mySelect"); 方法一：通过new Option(value,text)函数，第一个参数是显示的文字，第二个参数是value值，如果需要添加其他属性，可以这样： var opp = new Option("aaa","0

formData文件上传兼容IE8

橘子的博客

12-05

2638

场景：XP环境IE8版本的浏览器，在iframe内文件上传问题： 1、使用webupload 在ie8下模拟点击打开文件选择器，按钮点击无反应。查阅资料后，得知原因是webupload在ie8下使用的是flash显示，不存在input文件选择，所以模拟点击无效。手动直接点击打开文件选择器，第二次点击按钮无反应。查阅资料后，发现webupload选择器放在datagrid表格里...

参与评论您还未登录，请先登录后发表或查看评论

解决Select标签的Option在IE浏览中display:none不生效的问题

dizong1532的博客

05-08

1216

页面的Select标签，需要控制Select的Option不需要显示，根据条件来隐藏某些Option选项。正常情况下使用hide()就能实现，hide()方法实际是给Option加上display属性(display:none)，这样就可以隐藏掉Option；但是IE浏览器下Option(display:none)是不生效的，解决方案是：直接对Option包一层，加Span标签。...

完美解决IE浏览器 option display:none 隐藏无效

郭猛的博客

11-04

9059

最近遇到了select 下的option需要根据前一个select选项来显示或隐藏，发现在IE下该功能无法实现。自己在网上看了一下前辈们的解决方法，然后根据自己的实际情况改了一下，放在这里给需要的朋友。//初始化select function toggleOptionInit(obj,firstException){ var firstException = argume

IE浏览器select-option不支持display属性

weixin_33912638的博客

08-08

244

2019独角兽企业重金招聘Python工程师标准>>> ...

IE6/7下Select控件Display属性无效解决办法

weixin_33843409的博客

08-18

315

HTML的Select控件，C#的DropDownList服务器控件设置父类型Display属性之后，在IE6/7上无效直接将下段javascript脚本添加到页面中即可 <scripttype="text/javascript"> window.onload=function(){ if(document.getElementsB...

解决option设置display：none不兼容ie的问题

A_bet_of_three_years的博客

05-13

3818

注意：1.option设置display：none不兼容ie的问题 2.option的外包含标签和内包含标签浏览器都不读取自动拦截，也不报错。解决display：none的兼容问题 <!DocType html> <head> <meta charset="utf-8"> </head...

IE不支持option的display样式，只能使用remove和add

12-09

本以为通过display:none即可实现，结果发现在option元素上使用display:none在firefox中有效，在IE6、IE7、IE8中都无效。所以，通过javascript设置display:none也是在IE中无效，代码如下： it works……...

ie下美化表单，兼容各大浏览器

04-08

2. **使用伪元素**：利用`:before`和`:after`伪元素，可以添加自定义的箭头图标，但这种方式在IE9及以下版本中可能无效。 3. **JavaScript库和插件**：如`Select2`, `Chosen`, `Selectize`等库提供了高度可定制的...

HTML5和CSS3 WEB技术开发

最新发布

张晨光老师的播客

01-02

6427

B站视频参考：https://www.bilibili.com/video/BV1H44y1k7ze/[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uwbid43Z-1672665963237)(asseits/image-20210831212039584.png)]HTML:超文本标记语言(Hyper Text Markup Language)，标准通用标记语言下的一个应用。 HTML 不是一种编程语言（C、Java、python、R等），而是一种标记语言 (markup

option中css失效,option.style.display =“ none”在野生动物园中不起作用

weixin_42566072的博客

08-04

677

HTML：helloI'M THE CHOSEN ONEasdwerqweJS：var sel = document.getElementById("asd");var optnz = sel.getElementsByTagName("option")[1];sel.value = optnz.value;optnz.style.display = "none";如您所见，它在chrome中有效...

displayOptions 属性

天马行空

08-20

1287

displayOptions 属性源码中有如下的成员： "displayOptions"> "none" value="0" /> "useLogo" value="0x1" /> "showHome" value="0x2" /> "homeAsUp" value="0x4" />

IE不支持option的display样式，只能使用remove和add【转】

weixin_34381687的博客

01-12

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="yue-Hans" lan...

IE678不支持<option>style="display:none"

bamboo_cqh的博客

05-09

1407

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> html xmlns="http://www.w3.org/1999/xhtml" xml:lang="yue-Hans" lang="yue-H

小心display:flex;这个属性，低版本的ie不支持，可能会显示不出来

weixin_42626475的博客

07-26

3988

.dialog { position: fixed; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;...

解决IE下select option不支持display none样式

weixin_30467087的博客

08-20

220

万恶的IE，option竟然不支持display样式，想到的解决思路有二个：　　1、ajax联动查询　　2、jQuery的remove()、after()方法方法1的不好之处是初始页面，需要显示全部IP，本来已经从后台查询了一次，如果再利用ajax，会给服务器造成压力，所以采用方法2。后台code // 获取所有平台类型IP$vcenter_ip = $this-&gt...

IE浏览器不支持display:none导致option不能隐藏的问题

韦观松のBóKè

04-28

9927

项目场景：级联的select元素，根据一级select的选择，二级select中的option选项需要对应的隐藏或显示。原来的做法是display:none和display:block来隐藏和显示option，option中通过自定义属性data-category过滤，控制option的隐藏或显示，结果在IE浏览器中并不能达到想要的效果，通过网络查找，是因为IE浏览器不支持display:no

【解决】SELECT标签中OPTION的显隐控制(兼容IE)

08-20

1043

问题描述：在有些功能切换的时候，select标签中的某些option是要被隐藏的。但通过设置option的样式为 display:none根本无法隐藏option标签。解决方案： 1、首先设置option的display:none的方案肯定是不可行了； 2、某网友提出的两种方案： 1.在option标签上面加上disabled="disabled"属性，表示不可用，这种方案只是让opt...

＜el-select/＞display设置成none后设置成inline等其他属性无法显示的问题

qq_43527397的博客

08-30

1111

使用ELEMENTUI select组件时,如果使用display直接作用在组件节点上,一旦设置成none后，会破坏组件原本的属性，即使后面设置成inline等其他可显示属性，也无法显示。正常做法：在想要设置显示/隐藏的组件外添加一层<div></div>,然后通过设置div的display控制组件的隐藏和显示，在select组件中不做display的设置。 <div id="labelId" style="display:none"> <el-selec

HTML select option详解：属性、方法与应用

5. `defaultSelected`属性：返回`<option>`元素在页面加载时是否被默认选中。如果设置为`true`，则该选项将在页面加载时自动选中。三、`option`对象的方法 1. `add()`方法：向`<select>`元素中添加新的`<option>`...