2010.04.26(2)———另一个例子弹出层选择收件人的效果-CSDN博客

本文链接：https://blog.csdn.net/cody123/article/details/83610959

2010.04.26(2)———另一个例子弹出层选择收件人的效果

1.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-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../My Documents/短信管理/js/jquery-1.3.2.js"></script>
</head>

<body>
<input type="text" value="" id="mailsender" style="width:600px;" />
<!--
  <a onclick="setAddress(this.title);" href="javascript:void(0)" title="csdn@csdn.com">csdn@csdn.com</a><br/>

  <a onclick="setAddress(this.title);" href="javascript:void(0)" title="csdn1@csdn1.com">csdn1@csdn1.com</a><br/>

  <a onclick="setAddress(this.title);" href="javascript:void(0)" title="csdn2@csdn2.com">csdn2@csdn2.com</a>-->

 	<div id="tbAddrTree">
      <ul>
      <input type="checkbox"  value="A" id="a" >人员
        <li><a onclick="setAddress(this.title)" title="zhangsan" id="zhang">张三</a></li>
        <li><a onclick="setAddress(this.title)" title="lisi" id="li">李四</a></li>
        <li><a onclick="setAddress(this.title)" title="wangwu" id="wang">王五</a></li>
      </ul>
    </div> 
  <script type="text/javascript">
	function checkall(list,inputText){	//list 和 inputText都是jQuery对象
		var obj = inputText.val();
		$.each(list,function(i,o){ //遍历对象
			var $text = $(o).attr("title");
			obj += $text;
			obj += ",";
		})
		inputText.val(obj);
	}
	function f1(checkbox,inputText){
		$(checkbox).click(function(){
			if($(checkbox).is(":checked")){
				checkall($("#tbAddrTree li a"),inputText);
			}else{
				$(inputText).val("");
			}
		});
	}
	$(function(){
		f1($("#a"),$("#mailsender"));

	});

    //一系列的字符串操作，来判断是够这个人已经存在于input中
    //这个判断还是比较精简的 很好
    function setAddress(str){

        var obj = document.getElementById("mailsender");
        var objval = obj.value; 
       	if(objval.indexOf(str) >-1){
		obj.value= objval.replace(str+",","");
	}else{
           	obj.value += str+",";
        }
    } 

  </script>
</body>
</html>