html

<label class="selectGroup">

<span class="selectP"></span>
<select class="select">
<option>类型1</option>
<option>类型2</option>
<option>类型3</option>
</select>
<i class="leftT"></i>
<i class="leftB"></i>
<i class="rightT"></i>
<i class="rightB"></i>
</label>

js

$(".selectGroup .select").change(function(){
$(this).parent('.selectGroup').find(".selectP").text($(this).children('option:selected').val());
})

js模拟下拉框的更多相关文章

  1. JS模拟下拉框select

    最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...

  2. jquery模拟下拉框单选框复选Select,Checkbox,Radio

    在项目中,你会发现设计稿中常常会有单选框,复选框,但都不是系统默认的样式,这就可以用jquery来模拟它们:如图所示,实现它们所需要的代码如下: 首先需要引入的代码: <link rel=&qu ...

  3. jQuery+css模拟下拉框模糊搜索的实现

    html: @*输入框*@ <div> <input type="text" style="width: 85%; height: 34px;" ...

  4. Js获取下拉框选定项的值和文本

    Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...

  5. div模拟下拉框

    1.模拟下拉框.点击文本框在文本框下面显示一个层divList,点击divList以外的任何地方,关闭divList层 document.body.onclick = function (e) { e ...

  6. js改变下拉框内容

      js改变下拉框内容 CreateTime--2018年4月8日18:47:38 Author:Marydon 适用场景:通常情况下,级联菜单.通过ajax异步获取后台数据改写下拉框内容会有这种需求 ...

  7. JS 实现下拉框去重

    JS 实现下拉框去重 学习内容: 需求 总结: 学习内容: 需求 用 JS 下拉框去重 实现代码 <html> <head> <meta http-equiv=" ...

  8. JS 实现下拉框回显

    JS 实现下拉框回显 学习内容: 需求 总结: 学习内容: 需求 用 JS 实现下拉框回显 实现代码 <!DOCTYPE html> <html lang="en" ...

  9. JS实现下拉框选中不同的项,对应显示不同的信息

    实现的效果如下图: 页面代码 下拉框: <select id="select3" name="select3" onchange="showli ...

随机推荐

  1. JPA 不生成外键

    在用jpa这种orm框架时,有时我们实体对象存在关联关系,但实际的业务场景可能不需要用jpa来控制数据库创建数据表之间的关联约束,这时我们就需要消除掉数据库表与表之间的外键关联.但jpa在处理建立外键 ...

  2. [Unity3D] 03 - Component of UI

    还需进一步整理! ing... 博客参考 Unity 相关博客:Unity游戏开发爱好者 Unity 3D 连接Mysql数据库 Unity uGUI 登录界面 Unity uGUI 登录及注册功能 ...

  3. CentOS7.5 Linux搭建全文检索--Solr7.4.0单机服务

    一.Solr安装环境 1.官方参考文档 Solr教程参考指南:http://lucene.apache.org/solr/guide/7_4/solr-tutorial.html 2.Solr运行环境 ...

  4. Ubuntu 配置vsftpd实现FTP服务器

    0.vsftpd是啥玩意 都不知道安装了个啥东西,那就没意思了,所以先去了解下什么是vsftpd.vsftpd意思为“very secure FTP daemon(非常安全的FTP进程)”,当然只有更 ...

  5. js 基础知识总结

    1.switch结构 switch语句部分和case语句部分,都可以使用表达式. switch(1 + 3) { case 2 + 2: f(); break; default: neverhappe ...

  6. centos 阿里云 安装VNC Viewer

    https://help.aliyun.com/knowledge_detail/41530.html 这个东西非常的不安全,极其容易造成密码账号丢失.非常容易导致各类远程攻击,切记...

  7. centos 下部署django nginx+uwsgi

    为了建立一个工作站,也是麻烦了.... 感谢该博主: https://www.cnblogs.com/levelksk/p/7921066.html 1.安装centos 后首先安装python,下载 ...

  8. [No0000166]CPU的组成结构及其原理

    中央处理器(Central Processing Unit, CPU) CPU的基本架构和工作原理其实百科上讲得已经相当清楚了,不过我觉得有些事情呢还是给个例子出来比较方便学习.本文会先从内存地址,计 ...

  9. 自动化运维工具-pssh工具安装配置及简单使用讲解

    1.先决条件:安装pssh工具要求python版本大于2.4即可. 安装pssh工具的主机针对远程主机需要配置免秘钥认证: ssh-keygen -t rsa ssh-copy-id [remoteh ...

  10. Gif动态图UIImage

    #pragma mark 动态图生成 -(UIImage *)getAnimatedGIFWithData:(NSString *)path { NSData *data = [NSData data ...