zoukankan      html  css  js  c++  java
  • jquery仿jquery mobile的select控件效果

    不说废话。直接上代码
    //仿jQuery mobile Select控件
    //使用方法box为容器id,_id指控件id,selectvalue为选中值,Value为当前值
    function SelectBox(box,_id,selectvalue,Value)
    {
    	if(Value != selectvalue)
    	{
    		$("#" + box).html("<input type=hidden value='" + Value + "' id='" + _id + "'><span id="on" + _id + "" class="on" style="0px"></span><span id="off" + _id + "" class="off"></span>");
    		$("#off" + _id).css("width","82px");
    	}
    	else
    	{
    		$("#" + box).html("<input type=hidden value='" + Value + "' id='" + _id + "'><span id="on" + _id + "" class="on"></span><span id="off" + _id + "" class="off" style="0px"></span>");
    		$("#on" + _id).css("width","82px");
    	}
    	$("#on" + _id).click(function(){
    		$("#on" + _id).animate({"0px"},100);
    		$("#off" + _id).animate({"82px"},100);
    		$("#" + _id).val(Value);
    	});
    	$("#off" + _id).click(function(){
    		$("#on" + _id).animate({"82px"},100);
    		$("#off" + _id).animate({"0px"},100);
    		$("#" + _id).val(selectvalue);
    	});
    }
    

    用法:

    <span id="q"></span>
    <script type="text/javascript">
    CheckBox("q","a",1,0);
    </script>
    



     

  • 相关阅读:
    红黑树
    jsp简单练习-简单的下拉表单
    【源代码】TreeMap源代码剖析
    ScrollView垂直滚动控件
    进度条控件基本使用
    时间对话框的使用
    DatePicker日期与时间控件
    ImageView显示网络上的图片
    bitmap==null
    android.os.NetworkOnMainThreadException
  • 原文地址:https://www.cnblogs.com/wzjhoutai/p/7278665.html
Copyright © 2011-2022 走看看