select选项框特效
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<select name="slt" id="slt" style="width: 100px"></select>
<script src="js/jquery-1.11.3.js"></script>
<script>
var arr1 = ["A","B","C","D"];
var arr2 = ["+111","+222","+333","+444"];
function arr(){
$('#slt').html("");
for(var i= 0;i<arr1.length;i++){
//var ops= $("<option value="+i+">"+arr1[i]+""+arr2[i]+"</option>");
var ops= "<option value="+i+" id='d"+i+"'>"+arr1[i]+""+arr2[i]+"</option>";
$('#slt').append(ops);
}; };
arr();
var p=true;
var x =0;
$('#slt').unbind("click").click(function (e) { if(p){
x++;
p=false;
//$('#slt').unbind("click")
console.log(2)
e.stopPropagation()
$('#slt').html("")
arr();
}
}) $('#slt').change(function(){ //var slt = $('#slt').val();
var slt = $('#slt option:selected').html(); console.log(slt)
var inx = slt.indexOf("+"); var inn = slt.slice(inx);//+后面
var slc = slt.slice(0,inx);//+前面
//var slc = txt.slice(inx);
//$('#slt').text(slc);
console.log(slc);
//console.log(inn);
// var ops= "<option value='i'>"+arr1[i]+""+arr2[i]+"</option>"; $('#slt option:selected').html(slc);
//console.log($(this).text())
if(x%2 == 0){
p=false;
}
if(x%2 == 1){
p=true;
}
});
//arr();
</script>
</body>
</html>
select选项框特效的更多相关文章
- js进阶 9-11 select选项框如何动态添加和删除元素
js进阶 9-11 select选项框如何动态添加和删除元素 一.总结 一句话总结: 二.js进阶 9-11 select选项框如何动态添加和删除元素 1.案例说明 2.相关知识 Select 下拉列 ...
- 解决 Ant Design Modal 中的 Select 选项框不能显示的问题
antd 的 select 在 modal 里不能显示候选框 代码示例 <a-modal> <a-select> <!-- options --> </a-s ...
- [js开源组件开发]模拟下拉选项框select
模拟下拉选项框select 在css3流行的情况下,下拉框还是无法满足PD的需求,所以有了autosearch,有了模拟下拉框.效果如下图: select DEMO请案例点击这里查看.http://w ...
- 微信小程序之自定义select下拉选项框组件
知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件, ...
- python+selenium七:下拉框、选项框、select用法
# from selenium import webdriverfrom selenium.webdriver.common.action_chains import ActionChainsimpo ...
- WeChat-SmallProgram:自定义select下拉选项框组件
1):创建组件所需的文件 2):自定义组件 CSS 及 JS 组件的wxml: <view class='com-selectBox'> <view class='com-sCont ...
- 仿51job.com城市选择框特效
650) this.width=650;" border="0" alt="" src="http://img1.51cto.com/att ...
- 使select文本框可编辑可选择(jQuery插件)
最近做项目中用到了这个插件,正好分享下. 1. 需要用的js包点击下载,在项目中引入该js. <script src="${pageContext.request.contextPa ...
- Notes: select选择框
HTML选择框通过select标签创建,该元素是HTMLSelectElement的实例,拥有以下属性和方法: selectedIndex:选中项的索引 options:选择框的所有选项 add:向选 ...
随机推荐
- HDU2066一个人的旅行(dijkstra)
一开始拿到这个题感觉floyd可能会超,还是写了写,果然1WA+1TLE,之后觉得用dijkstra试试看看S和D会不会比较小,还是1WA+1TLE,最后还是借鉴了别人的做法. 把他的家作为起点,与他 ...
- 不能发现 class "com.uustudio.unote.android.BaseApplication"
12-13 15:45:46.289: E/AndroidRuntime(3474): java.lang.RuntimeException: Unable to instantiate applic ...
- st_Alarm_GenAlarmDealTime
USE [ChiefmesNew]GO/****** Object: StoredProcedure [dbo].[st_Alarm_GenAlarmDealTime] Script Date: 04 ...
- SQL SERVER 2008/2012/2012R2/2014 设置开启远程连接(sa配置)
本文方案适用于Microsoft Sql Server 2008/2012/2012 r2/2014版本,以下简称MSSQLSERVER. MSSQL默认是不允许远程连接,并且禁用sa账户的.如果想要 ...
- 详解Oracle创建用户权限全过程
本文将介绍的是通过创建一张表,进而实现Oracle创建用户权限的过程.以下这些代码主要也就是为实现Oracle创建用户权限而编写,希望能对大家有所帮助. 注意:每条语语分开执行,结尾必须用分号; // ...
- VS2012开发ActiveX插件 尝试1
今天闲来无聊研究了下 ActiveX插件开发,以前一直以为很牛逼,然后发现还是比较简单的东西.. 首先: 在开始前 准备好 VS12开发工具,cabarc.exe 工具(注:这是 用来 将文件打包成c ...
- CDOJ 486 Good Morning 傻逼题
Good Morning Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/show/486 ...
- Windows 窗体的.Net 框架绘图技术
当编写一个典型的Windows 窗体程序时,窗体和控件的绘制.效果等操作是不需要特别加以考虑的.这是为什么呢?因为通过使用 .Net 框架,开发人员可以拖动一系列的控件到窗体上,并书写一些简单的与事件 ...
- delphi execCommand
WebBrowser1.Document as IHTMLDocument2 关键点 function execCommand(const cmdID: WideString; showUI: Wor ...
- 将Uploads文件夹移到其它地方
1.在创建目录 cd /mnt/xvdb mkdir qingtong 2.复制目录和权限 cp -rp /Uploads/ ./ -r 包括目录 p权限 3.创建软链接 ln -s /mnt/xvd ...