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. springboot+shiro+redis(单机redis版)整合教程-续(添加动态角色权限控制)

    相关教程: 1. springboot+shiro整合教程 2. springboot+shiro+redis(单机redis版)整合教程 3. springboot+shiro+redis(集群re ...

  2. Scala学习笔记——断言和单元测试

    1.断言 assert(conditon)将在条件不成立的时候,抛出assertionError assert(conditon,explanation)讲在条件不成立的时候,抛出explanatio ...

  3. Redhat6.5——解决yum功能不能正常使用

    以前或多或少接触过linux服务器,由于是服务器上的,很多东西也没去玩过.要想多研究,还是得自己弄一个linux系统.由于正常工作,还是接触windows更多,双系统显然没有那么方便,所以决定弄个虚拟 ...

  4. 公众平台返回原始数据为: 错误代码-40164,错误信息-invalid ip, not in whitelist hint

    1.登录公众平台,进入开发->基本配置页面 2.点击配置进入IP白名单设置页 3.填写微客助理IP地址:183.63.25.68 4.管理员扫码确认保存 5.设置成功后点击“关闭” 6.修改成功 ...

  5. js 六种数据类型的区别及bool 转换判断

    一.bool型转换判断: 1.true 和 1 比较是相同,false 和 0 比较是相同(是 “==” 比较),因为内部会实现数据类型的 转化,将true 转换成1,将false 转换成0, js ...

  6. Docker - Docker中搭建MySQL主从

    1.pull完centos7纯净版的镜像后,创建容器,然后将宿主机上下载的MySQL文件 (MySQL下载地址:http://mysql.mirror.kangaroot.net/Downloads/ ...

  7. 【Scikit】实现Multi-label text classification代码模板

    Refer to: https://stackoverflow.com/a/10527953 code: # -*- coding: utf-8 -*- import numpy as np from ...

  8. findpanel 的相关代码

    https://blog.csdn.net/zengcong2013/article/details/43118189 In addition to this method, you can use ...

  9. 爬虫----爬虫解析库Beautifulsoup模块

    一:介绍 Beautiful Soup 是一个可以从HTML或XML文件中提取数据的Python库.它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.Beautiful Soup会帮你 ...

  10. Codeforces 670E - Correct Bracket Sequence Editor - [对顶栈]

    题目链接:https://codeforces.com/contest/670/problem/E 题意: 给出一个已经匹配的括号串,给出起始的光标位置(光标总是指向某个括号). 有如下操作: 1.往 ...