js-select

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>Title</title>  <style>    .blue{      background: #ccf;      color:#339;    }    .pink{      background: #af3;      color: #a62;    }    .dark{      background: #111;      color: #eee;    }  </style></head><body><select name="" id="slt">  <option value="">请选则</option>  <option value="blue">湛蓝天空</option>  <option value="pink">芭比公主</option>  <option value="dark">杀马特</option></select><script>  ifBg()  function ifBg(){    var val=localStorage[‘bg‘];    if (val){      document.body.className=val;    }  }  var slt=document.getElementById(‘slt‘);  slt.onchange=function(){    //选择的value   // console.log(this.value)    //获取用户选择option在列表中是第几项    var n=this.selectedIndex;    if (n==‘1‘){      document.body.className=‘blue‘;      localStorage[‘bg‘]=‘blue‘    }else if(n==‘2‘){      document.body.className=‘pink‘;      localStorage[‘bg‘]=‘pink‘    }else if(n==‘3‘){      document.body.className=‘dark‘;      localStorage[‘bg‘]=‘dark‘    }    console.log(this.selectedIndex)  }</script></body></html>
时间: 2024-08-05 12:23:47

js-select的相关文章

js select级联,上面分类,下面是内容

js select级联,上面分类,下面是内容. js级联效果如下: 分类: 请选择 水果 蔬菜 其他 内容: html和js代码如下:     <html>      <head>         <title>js select级联,上面分类,下面是内容</title>        <meta http-equiv="Content-Type" content="text/html;charset=GBK"/

JS Select 月日日期联动

Js对Select控件进行联动操作,一个select选择月份后另一个select生成对应月份的所有日期. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org

js select选中

js信息: $(".wrapl").change(function () { var s = this.options[this.selectedIndex].value;$(this).prev().html(s);}); html信息: <table> <tr> <td> <label style="display: none">A</label> <select class="wrap

js select操作

1.根据select的id给option填充数据 $("#page_sel_country_edit").append("<option value="+ id+ ">" + name+ "</option>"); 2.JQuery对象与dom对象互相转换 JQObject[0]=DOMObject 3.给input,塞入提示信息(应用场景:12306输入提示地址) 在input下面定义一个ul,然后动

一个简单js select插件

现在,通过一个select插件,来介绍一下js插件的构建过程. 1.先上效果图 2.目录构建 (1)这个select插件,我给它起名交hongselect,所以呢,首先建个hongselect的文件夹. (2)接着建一个src目录来放源码. (3)我想把源代码托管到github上,所以呢,再建一个README.md文件,来写这个插件的一个说明文档. (4)然后建一个.gitignore文件,来说明那些文件或文件夹是不需要加入代码版本管理的. (5)该插件依赖于jQuery,我们要下载它,对于js

js select 实现左右传值.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Js Select动态添加Option

var now = new Date(); function setDate(type, id, from, to) { var str = ""; for (var i = from; i < to + 1; i++) { if ((type == "y" && i == now.getFullYear()) || (type == "m" && i == now.getMonth() + 1) || (t

js控制select选中显示不同表单内容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Asp.net MVC在View里动态捆绑压缩引用的js

前言 Asp.net MVC 4以上版本多了BundleConfig.RegisterBundles方法,可以把要捆绑的脚本或样式进行捆绑压缩,以减少客户端的请求次数从而提高了客户端的访问速度. 问题 但世上懒人的数量还是很多,我也是一个,觉得这个方法还不够方便.在实际中,一些小的页面或独立页面,开了一些开源的js库之后,js文件比较多,而且每个页面引用的js又不太一样,如果能不在BundleConfig描述如何捆绑,像传统一样把js拉过来就能自动达到捆绑后的效果,是懒人多想要的结果.正是朝着这

jquery模拟实现仿select效果

本着服务为人民的远大理想,最近写了个jquery模拟select效果的小东东,挺好用,分享下. 可以直接在我上传的资源里下载压缩包,下载地址:jquery模拟实现仿select效果. 首先,上html页面代码 <!doctype html> <html> <head> <meta charset="utf-8"> <title>js模拟select</title> <link rel="styles