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浏览器不支持.于是在百度找了一些解决方法,找了好几个都不是那么完美, ...
随机推荐
- 使用gRPC-Gateway快速构建微服务-双向认证下rpc-gateway使用(同时提供rpc和http接口)
https://github.com/grpc-ecosystem/grpc-gateway 在grpc之上加一层代理并转发,转变成protobuf格式来访问grpc服务 安装 go get -u g ...
- Spring MVC(二)--Spring MVC登陆实例
本文通过一个简单的登陆实例实现Spring MVC的流程,同时整合 MyBatis使用,流程是这样的: 1.访问一个URL进入登陆界面 2.输入正确的用户名和密码,成功则进入index页面,否则留在登 ...
- 加载框(loading)
一般在用户提交数据或者新加载页面时,请求服务器的过程,页面没有响应,但是用户并不知道,此时在发生什么.这时,就需要loading框给用户提示,增加用户体验. 1.引入loading.css. html ...
- Java 如何在线打开编辑word文档?
在一般的OA项目中经常会遇到在线处理Office文档的需求,先下载文件,编辑保存后再选择文件上传的方式太过原始,在如今早已是Office Online的时代,没有用户能接受这种蹩脚的操作方式. 虽然微 ...
- Spring.之.报错:Caused by: java.lang.IllegalArgumentException: No Spring Session store is configured: set the 'spring.session.store-type' property
Spring.之.报错 No Spring Session store is configured springboot在启动的时候报如下错误: Error starting ApplicationC ...
- Codeforces 899F Letters Removing 线段树/树状数组
虽然每次给一个区间,但是可以看作在区间内进行数个点操作,同样数列下标是动态变化的,如果我们将每个字符出现看作1,被删除看作0,则通过统计前缀和就能轻松计算出两个端点的位置了!这正是经典的树状数组操作 ...
- 15分钟构建超低成本数据大屏:DataV + DLA
第一步:准备低成本存储的业务数据和DLA表 OSS(https://www.aliyun.com/product/oss)是云上低成本数据存储的优选方案 DLA(https://www.aliyun. ...
- LUOGU P3024 [USACO11OPEN]奶牛跳棋Cow Checkers
题目描述 One day, Bessie decides to challenge Farmer John to a game of ‘Cow Checkers’. The game is playe ...
- Thinkphp 数据库配置参数
mysql配置 'DB_USER' => array( 'DB_TYPE' => 'mysql', 'DB_HOST' => '127.0.0.1', 'DB_NAME' => ...
- 51nod1947 栈的代价和
1947 栈的代价和 n是5e7 只能O(n)做 大力生成函数转形式幂级数再解方程 这个是广义二项式定理: https://baike.baidu.com/item/%E4%BA%8C%E9%A1%B ...