简单的选择器

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus" charset="utf-8"/>
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style type="text/css">
	.select{background-color:#f00;}
  </style>
 </head>
 <script type="text/javascript"  src="js/jquery-1.7.min.js"></script>
 <script type="text/javascript">
			function test(a,b,c,d){
					a.click(function(){					
							if($("#div"+b+" .select").length==0){
									alert("请选择语言!");
							}else if($("#div"+b+" .select").length>1&&d==1){

									alert("不能同时对多种语言进行操作");
									
							}else{
									c.append($("#div"+b+" .select"));

									$("#div"+b+" .select").remove();
							}
					})
			}


		$(document).ready(function(){
			
				$("#div1 p").toggle(
					  function(){
					  $(this).addClass("select");},
					  function(){
					  $(this).removeClass("select");
					  });
				
				test($("#b1"),1,$("#div3"),0);
				test($("#b2"),1,$("#div3"),1);
				test($("#b3"),3,$("#div1"),1);
				test($("#b4"),3,$("#div1"),0);


	})
 </script>

 <body>
	  <div id="div0" style="width:400px;heigth:200px;">
			<div id="div1" style="border:1px solid #000000;width:150px;height:250px;float:left;">
					 <p	 id="p1">俄语</p>
					 <p	 id="p2">日语</p>
					 <p	 id="p3">英语</p>
					 <p	 id="p4">德语</p>
					 <p	 id="p5">法语</p>
					 <p	 id="p6">其他外语</p>
			</div>
			<div id="div2" style="width:40px;float:left;">
			<p><input type="button" value=">>" id="b1" style="width:40px;"></p>
			<p><input type="button" value=">" id="b2" style="width:40px;"></p>
			<p><input type="button" value="<" id="b3"  style="width:40px;"></p>
			<p><input type="button" value="<<" id="b4" style="width:40px;"></p>
			</div>
			<div	id="div3" style="border:1px solid #000000;width:150px;height:250px;float:left;">
			
			</div>
		</div>
 </body>
</html>


 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值