`
jxqc_job
  • 浏览: 529 次
社区版块
存档分类
最新评论
收藏列表
标题 标签 来源
自己实现的下拉多选框 自己实现的下拉多选框
<html>
<head>
</head>
<body>


<div>
	<span>快捷按钮设置</span>
	<input type="text" id="p006_name" value="" style="width:350px;" readonly="readonly" /><img src="ars.PNG" style="position:relative;top:5px;height:20px;" onclick="contrlShortcutButtonLink()" />
	<input type="text" id="p006_url" value="" style="width:550px;" readonly="readonly" />
	<div id="shorcutButtonDiv" onmouseleave="contrlShortcutButtonLink()" style="display:none;position:relative;left:110px;border:1px solid black;width:150px;height:auto;z-index:8999;"></div>
</div>
<div>
	<div>
	<span>排序号</span><input type="text" value="" />
	</div>
</div>
<div>
	<input type="button" value="发布" onclick="disployInfo()" />
</div>
<script type="text/javascript">
    
	function o(id , name, url){
	    this.id = id;
		this.name = name;
		this.url = url;
	}
	
	var o1 = new o("1","营业厅","www.baidu.com");
	var o2 = new o("2","话费查询","www.iteye.com");
	var o3 = new o("3","套餐查询","www.csdn.com");
	var s = [];
	s.push(o1);
	s.push(o2);
	s.push(o3);
	
	var shtml = '';
	var len = s.length;
	if(len > 5){
		len = 5;
	}
	for(var i = 0; i < len; i++){
		shtml += '<input type="checkbox" name="shortcutLinkBox" value="'+s[i].name+'####'+s[i].url+'"  />'+s[i].name+'<br />';
	}
	document.getElementById('shorcutButtonDiv').innerHTML = shtml;
	//alert(shtml);
	
	var _names = '';
	var _urls = '';
	function disployInfo(){
		setShortcutButtonLinkVal();
		alert(_names);
		alert(_urls);
	}
	
	function setShortcutButtonLinkVal(){
	     _names = '';
	     _urls = '';
	    document.getElementById("p006_name").value = "";
		document.getElementById("p006_url").value = "";
		var shortcutLinkBoxList = document.getElementsByName("shortcutLinkBox");
		for(var i = 0; i < shortcutLinkBoxList.length; i++){
			var _box = shortcutLinkBoxList[i];
			if(_box.value != "" && _box.checked){
				var _boxKV = _box.value.split("####");
				_names += "," +  _boxKV[0];
				_urls += "," +  _boxKV[1];
			}
			//alert(_box.value+":"+_box.checked);
		}
		if(_names != ""){
			_names = _names.substring(1);
		}
		if(_urls != ""){
			_urls = _urls.substring(1);
		}
		document.getElementById("p006_name").value = _names;
		document.getElementById("p006_url").value = _urls;
	}
	
	var isYShowShortcutFlg = false;
	function contrlShortcutButtonLink(){
	    setShortcutButtonLinkVal();
		if(isYShowShortcutFlg){
			isYShowShortcutFlg = false;
			document.getElementById("shorcutButtonDiv").style.display="none";
		}else{
			isYShowShortcutFlg = true;
			document.getElementById("shorcutButtonDiv").style.display="block";
		}
		
		
	}
	
	
</script>
</body>
</html>
Global site tag (gtag.js) - Google Analytics