解决IE下select option不支持display none样式
万恶的IE,option竟然不支持display样式,想到的解决思路有二个:
1、ajax联动查询
2、jQuery的remove()、after()方法
方法1的不好之处是初始页面,需要显示全部IP,本来已经从后台查询了一次,如果再利用ajax,会给服务器造成压力,所以采用方法2。
后台code
// 获取所有平台类型IP
$vcenter_ip = $this->vcenter_mgr->get_vcenter_info(null, null, 'ip, virt_type', 'INET_ATON(ip)');
$virt_ip = array();
if (!empty($vcenter_ip)) {
foreach ($vcenter_ip as $arr) {
$virt_ip[]= array(
'virt_type' => $arr['virt_type'],
'virt_ip' => $arr['ip'],
);
}
}
exit(json_encode($virt_ip));
前端code
// 初始时显示所有IP
var virt_ip_obj = <?= $virt_ip ?>; // 后台返回的json数据
var virt_ip_opt = '';
if (virt_ip_obj.length > 0) {
$.each(virt_ip_obj, function(index, val) {
virt_ip_opt += '<option class="ip_opt" value="'+val.virt_ip+'">'+val.virt_ip+'</option>';
});
}
$('.virt_ip option:first').after(virt_ip_opt); // change事件
$('.adv-table').on('change', '.tts-options', function(event) {
var virt_type = $(this).val();
$('select .ip_opt').remove(); // 移除所有option项
if (virt_type > 0) {
var new_ip_opt = '';
if (virt_ip_obj.length > 0) {
$.each(virt_ip_obj, function(i, arr) {
if (arr.virt_type === virt_type) {
new_ip_opt += '<option class="ip_opt" value="'+arr.virt_ip+'">'+arr.virt_ip+'</option>';
}
});
}
$('.virt_ip option:first').after(new_ip_opt); // 选择指定平台时只显示指定平台下的所有IP
} else {
$('.virt_ip option:first').after(virt_ip_opt); // 选择所有平台时,显示全部IP
}
});

解决IE下select option不支持display none样式的更多相关文章
- IE8 下 select option 内容过长 , 展开时信息显示不全解决办法
IE8 下 select option 内容过长 , 展开时信息显示不全 , 简单折衷的方式就是给 option 加上 title 属性 , 但是又不想一个个的修改,怎么办呢,代码如下 : //sel ...
- 解决IE下select标签innerHTML插入option的BUG(兼容
在ie下面使用innerHTML来插入option选项的话,ie会去掉前面的<option>,并拆分成多个节点,这样会造成select的出错 前言: 这是一个老bug了,现在提供一个完 ...
- 解决IE6下select显示在弹出框上问题
利用定位position:absolute;z-index:1;和iframe[z-index:-1]来解决此问题,最好根据需要加上: border='0' frameborder='0' scrol ...
- 解决VMware下安装Ubuntu15不支持1920X1080分辨率的问题
解决步骤如下: flashmx@ubuntu:~$ cvt # 192.07M9) hsync: 67.16 kHz; pclk: 173.00 MHz Modeline -hsync +vsync ...
- 解决iPhone上select时常失去焦点,随意跳到下一个输入框,影响用户操作
window.addEventListener('load', function() { FastClick.attach(document.body); }, false); //300s延迟,解决 ...
- 解决IE6下不支持 png24的透明图片问题
常用的两种解决方案: 第一:使用IE滤镜解决 关键代码: css代码 _background:none;_filter:progid:DXImageTransform.Microsoft.Alpha ...
- jq插件又来了,模拟select下拉框,支持上下方向键哦
好久没来了,更新下插件, 这个原理就是利用的 input[type='hidden']和自定义属性data-value捆绑传值操作的,可是设置默认选项,回调等参数,代码不多,比较简单,吼吼 (func ...
- 解决IE6下浮层遮盖select刺穿的问题
图一未解决刺穿问题: 图二已解决 解决方法使用iframe间接挡住层,具体方法见源码 源码一(未解决刺穿): <html xmlns=" ...
- div模拟select/option解决兼容性问题及增加可拓展性
个人博客: http://mcchen.club 想到做这个模拟的原因是之前使用select>option标签的时候发现没有办法操控option的很多样式,比如line-height等,还会由此 ...
随机推荐
- JavaSE-序列化和反序列化
什么是序列化,什么时候要进行序列化? 序列化就是一种用来处理对象流的机制,所谓对象流也就是将对象的内容进行流化,将数据分解成字节流,以便存储在文件中或在网络上传输. 我们在对java对象进行IO流操作 ...
- Centos7下安装redis实战(单机版以及集群)
一.背景 因项目需要,要引入redis做缓存,就在centos7下亲自安装了一遍redis,刚好趁着这个机会就来把redis的概念以及单机版和集群版redis安装步骤记录下来,在此和大家一起分享. 二 ...
- text_edit 未定义解决
找到文件:admin\controller\setting $data['heading_title'] = $this->language->get('heading_title'); ...
- Solidity中如何判断mapping中某个键是否为空呢?
Solidity中如何判断mapping中某个键是否为空呢? 一.比较标准的做法是建立一个专门和value相关的结构体,用一个布尔型变量来看是否这个key所对应的value被赋过值 代码如下: pra ...
- MongoDB学习3 $操作符表达式大全及实例
from : http://blog.csdn.net/qq_16313365/article/details/58599253 1.查询和投影 1.1 比较操作符 $eq 语法:{ <fi ...
- Spark2.1.0——深入浅出度量系统
Spark2.1.0--深入浅出度量系统 对于一个系统而言,首先考虑要满足一些业务场景,并实现功能.随着系统功能越来越多,代码量级越来越高,系统的可维护性.可测试性.性能都会成为新的挑战,这时监控功能 ...
- Async和await关键字的用法
async & await 的前世今生(Updated) 1. 方法打上Async关键字, 就可以使用await调用别的Async方法了 2. 记得在需要异步执行的方法里面调用await或者n ...
- SpringMvc+hibernate+easyui简单的权限管理系统
用户登录: 主界面: 资源管理: 角色管理: 用户管理: 部门管理: 源码在群共享: 189811613 群满了,直接发链接吧链接:http://pan.baidu.com/ ...
- Java基础——详尽说明try-catch-finally的用法
问:Java异常处理机制,理解了吗?Java异常处理,真的掌握了吗?什么是自定义异常?catch体里遇到return 是怎么处理?finally 体里有return怎么处理?catch 和 final ...
- mysql 中int类型字段unsigned和signed的探索
转自:http://www.0791quanquan.com/news_keji/topic_816453/ 探索一:正负数问题 拿tinyint字段来举例,unsigned后,字段的取值范围是0-2 ...