select标签模拟placeholder属性与一般操作(最重要的是ios某一项被选中的兼容)
1.为了统一样式,常常要模拟placeholder
<select>
<option disabled selected hidden>请选择</option>
<option>what</option>
<option>the</option>
<option>hell</option>
</select>
2.select选中的值和某个值要被选中(ios兼容)
<select style="font-size: 60px">
<option>2</option>
<option>5年</option>
<option>10年</option>
<option>20年</option>
</select>
<select style="font-size: 50px" id="select_id ">
<option value="1">年交</option>
<option value="2">趸交</option>
</select>
a 取得选中值:
获取select 选中的 text :
$("selecr").eq(0).find("option:selected").text();
获取select选中的 value:
$("selecr").eq(0).val();
获取select选中的索引:
$("selecr")[0].selectedindex;
b 设置select
var iText= $("selecr").eq(0).find("option:selected").text();
$('select').eq(1).find("option[value = '"+iText+"']").prop("selected","selected");
之前用的是attr,但是发现ios怎么都不行,没想到只要把attr换成prop就没有兼容问题了,ios真是磨人的小妖精啊!
还有$('select').eq(1).val(iText);
$('select').eq(1).get(0).value =iText;
下面这俩种没有做兼容测试,按道理是没有问题的因为是修改之前的代码,不敢大改
c 清空 select:
$('select').eq(1).empty();
d 增加或减少select的opacity项
1 $'(#select_id').append("<option value='value'>text</option>"); //添加一项option
$(#select_id').prepend("<option value='0'>请选择</option>"); //在前面插入一项option
$("#select_id option:last").remove(); //删除索引值最大的option
$("#select_id option[index='0']").remove();//删除索引值为0的option
$("#select_id option[value='3']").remove(); //删除值为3的option
$("#select_id option[text='4']").remove(); //删除text值为4的option
select标签模拟placeholder属性与一般操作(最重要的是ios某一项被选中的兼容)的更多相关文章
- 获取表单的初始值,模拟placeholder属性
input和textarea有一个默认属性defaultValue,即初始值. 即使在页面操作修改了input和textarea的内容,获取到的defaultValue依然是初始值.可通过该值模拟pl ...
- <textarea></textarea>标签的placeholder属性不生效问题
<textarea></textarea>标签的placeholder属性不生效问题 1.在用到<textarea></textarea>标签时,设 ...
- 解决input标签placeholder属性浏览器兼容性问题的一种方法
为文本框input添加文字输入提示,H5为input提供了一个placeholder属性.在支持H5的浏览器中,用此属性设置输入提示,简单方便,但是对于IE8以下版本,都不支持placeholder属 ...
- 前端 html input标签 placeholder属性 标签上显示内容
前端 html input标签 的placeholder属性 标签上显示内容 <!DOCTYPE html> <html lang="en"> < ...
- Jquery循环select标签,并给指定option添加select属性后在页面上不显示的问题
<select id="testId"> <option value="">--请选择--</option> <opt ...
- jQuery效果之封装模拟placeholder效果,让低版本浏览器也支持
页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...
- 用select标签实现跳转
用select标签实现跳转 一.用select标签实现跳转JavaScript代码 我们经常有遇到需要用select标签跳转到新网页的情况,dw生成的代码太复杂,那么有没有精简的代码得以实现呢?经过仔 ...
- MyBatis select标签的用法
From<MyBatis从入门到精通> 第一步,在接口中添加方法: public interface UserMapper { SysUser selectById(Long id); } ...
- 基于jquery 的插件,让IE支持placeholder属性
开发一个项目的时候为了美观和用户体验用到了input标签的placeholder属性,但是这个属性是html5中的,所以低版本的IE浏览器不支持.于是在百度找了一些解决方法,找了好几个都不是那么完美, ...
随机推荐
- Cesium实现背景透明的方法
前言 今天有人在Cesium实验室QQ群里问如何把地球背景做成透明的,当时我以为Cesium比较复杂的渲染机制可能即使context设置了alpha属性也未必能透明,所以和同学说可能得改Cesium代 ...
- 【DM8168学习笔记4】ezsdk安装过程记录
安装文件 ezsdk_dm816x-evm_5_05_02_00_setuplinux DM8168-EZSDK文件结构如图所示. (图片来自:http://process ...
- Python学习之字典--三级菜单
效果图: 实现代码: dic = { '人物':{ '帽子':{'前年玄铁帽'}, '武器':{'屠龙宝刀'} }, '属性':{ '力量':{35}, '敏捷':{66} }, '任务':{ '主线 ...
- C# 全局Hook在xp上不回调
最近做了个捕捉全局鼠标,获取目标窗体内的控件文本信息,点击的按钮信息.用的全局钩子.在win10上运行正常,部署到xp系统上就没有反应.查了些资料,解决了此问题. 原本安装钩子的写法如下: Nativ ...
- JobTracker与TaskTracker的关系
JobTracker 对应于 NameNode TaskTracker 对应于 DataNode DataNode 和NameNode 是针对数据存放来而言的 JobTracker和TaskTrac ...
- Redis学习03——存储字符串(String)
--------------------- 作者:愤怒的小明 来源:CSDN 原文:https://blog.csdn.net/qiwenmingshiwo/article/details/78118 ...
- NPM:如何配置maven npm私服
https://help.sonatype.com/repomanager3/quick-start-guide-proxying-maven-and-npm#QuickStartGuide-Prox ...
- c++新特性实验(2)类型特性
1. 基本类型 1.1 增加 long long long long int signed long long signed long long int unsigned long long unsi ...
- Qt运行不出现界面
安装Qt之后按照例程运行,结果不出现界面,原因是路径中有中文,将中文全部改成英文之后,问题解决.
- URI、URL 和 URN的区别
关于URI:URL类似于住址,它告诉你一种寻找目标的方式. URL和URN都是URI的子集. URI规范:协议名称://域名.根域名/目录/文件名.后缀#sddf URI :Unifor ...