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某一项被选中的兼容)的更多相关文章

  1. 获取表单的初始值,模拟placeholder属性

    input和textarea有一个默认属性defaultValue,即初始值. 即使在页面操作修改了input和textarea的内容,获取到的defaultValue依然是初始值.可通过该值模拟pl ...

  2. <textarea></textarea>标签的placeholder属性不生效问题

    <textarea></textarea>标签的placeholder属性不生效问题   1.在用到<textarea></textarea>标签时,设 ...

  3. 解决input标签placeholder属性浏览器兼容性问题的一种方法

    为文本框input添加文字输入提示,H5为input提供了一个placeholder属性.在支持H5的浏览器中,用此属性设置输入提示,简单方便,但是对于IE8以下版本,都不支持placeholder属 ...

  4. 前端 html input标签 placeholder属性 标签上显示内容

    前端 html  input标签 的placeholder属性  标签上显示内容 <!DOCTYPE html> <html lang="en"> < ...

  5. Jquery循环select标签,并给指定option添加select属性后在页面上不显示的问题

    <select id="testId"> <option value="">--请选择--</option> <opt ...

  6. jQuery效果之封装模拟placeholder效果,让低版本浏览器也支持

    页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...

  7. 用select标签实现跳转

    用select标签实现跳转 一.用select标签实现跳转JavaScript代码 我们经常有遇到需要用select标签跳转到新网页的情况,dw生成的代码太复杂,那么有没有精简的代码得以实现呢?经过仔 ...

  8. MyBatis select标签的用法

    From<MyBatis从入门到精通> 第一步,在接口中添加方法: public interface UserMapper { SysUser selectById(Long id); } ...

  9. 基于jquery 的插件,让IE支持placeholder属性

    开发一个项目的时候为了美观和用户体验用到了input标签的placeholder属性,但是这个属性是html5中的,所以低版本的IE浏览器不支持.于是在百度找了一些解决方法,找了好几个都不是那么完美, ...

随机推荐

  1. .h头文件 .lib动态链接库文件 .dll 动态链接库

    (1).h头文件是编译时必须的,lib是链接时需要的,dll是运行时需要的. 附加依赖项的是.lib 不是.dll 若生成了DLL ,则肯定也生成 LIB文件 如果要完成源代码的编译和链接,有头文件和 ...

  2. day65-test

    目录 一.点击事件控制标签颜色 二.实现点击次数,变换页面标签的颜色 三.周期性实现颜色的旋转变色 练习题 一.点击事件控制标签颜色 1.有 红.黄.蓝 三个按钮,以及一个200x200矩形框box, ...

  3. C# 统一对 try...catch 的调用,方便保存错误日志

    每个优秀的开发人员,应该尽可能保证程序稳定运行,在确实不需要使用try...catch的地方尽尽量不要使用以提高程序性能. 但是我们不可能保证每段代码不会出错,由于出错引起的用户界面并不友好,而且有可 ...

  4. HBase底下的存储机制

    Split机制:可以理解为HDFS上Block一分二的情况.每个Table一开始只有一个region,随着数据不断插入表,region不断增大,当增大到一个阀值的时候,Hregion就会等分会两个新的 ...

  5. springmvc:请求参数绑定集合类型

    一.请求参数绑定实体类 domain: private String username; private String password; private Double money; private ...

  6. Luogu P1092 虫食算(枚举+剪枝)

    P1092 虫食算 题面 题目描述 所谓虫食算,就是原先的算式中有一部分被虫子啃掉了,需要我们根据剩下的数字来判定被啃掉的字母.来看一个简单的例子: 43#9865#045 + 8468#6633 4 ...

  7. 洛谷P3299 保护出题人

    注意每一关的时候,前一关的植物会消失.保留整数指四舍五入. 解:冷静分析一波,列一个式子出来,发现每一关的植物攻击力要是(ai + ... + aj) / (xi + d * (i - j))的最大值 ...

  8. 【洛谷3295】[SCOI2016]萌萌哒

    传送门 倍增并查集. //Twenty #include<algorithm> #include<iostream> #include<cstdlib> #incl ...

  9. hdu 1505 && hdu1506 &&hdu 2830 && 2870 总结---------DP之状图选最大矩形

    /* 多谢了“闭眼,睁眼” 同学给我一套dp专题,不然真是没接触过这种题型. 做个4个简单的,很高兴有所收获. 2013-08-06 /* HDU 1506 最基础的一道题目,其主要精髓就在于两个数组 ...

  10. springmvc 使用poi解析excel并通过hibernate连续插入多条数据 实际数据库只能保存最后一条

    有一个原始数据的excel表 用poi解析之后通过hibernate插数据库 结果 后来发现,有人说 果断尝试 问题解决 但是这好像并不是真正解决问题,只是解决了一个现象 因为有人说 https:// ...