搜索表单____

来源：互联网发布：手机淘宝看退款率编辑：程序博客网时间：2024/05/19 18:42
<html><head><title>搜索好友</title><style type="text/css">*{margin:0px; padding:0px;}div#search_area{width:481px; height:108px; border:1px #acacac solid; background-color:#CB9DC1; margin-left:410px; margin-top:1px;}p#area{margin-left:3px; width:160px;margin-top:1px; z-index:2;}select#province{height:30px;}select#city{display:none;width:54px;height:30px;position:relative; top:-30px; left:100px;}p#info{margin-left:120px; margin-top:-30px;}input#age{width:52px; height:30px;}div#tags{margin-top:-10px; margin-left:3px;}span.tname{color:red;position:relative; top:20px;}div.tag{width:420px; height:65px; border:1px #007065 dashed ;}div.tag input{margin-left:50px; margin-top: 5px;}div#user_info{width:700px;margin-left:410px; margin-top:2px;}div#user{border:1px solid #cde6c7;background-color:#918597;margin-bottom:2px;}div#user p {margin-top: 10px;}div#user p span{color:#6950a1;margin-left:30px;}span#image{position: relative;}</style><script type="text/javascript">//创建XHRfunction getXMLHttpRequest(){var xmlhttp=null;if(window.ActiveXObject){xmlhttp = new ActiveXObject("Microsoft.XMLHttp");}else{xmlhttp=new XMLHttpRequest();}return xmlhttp;}function $(id){return document.getElementById(id);}function change_info_pos(){var user_info = $("info");user_info.setAttribute("style", "position:relative;left:50px; top:-30px;");}function change_tag_pos(){var user_tag = $("tags");user_tag.setAttribute("style", "position:relative;left:3px; top:-32px;");}function select_city(id){var province = $(id).value;var url = "/ciba/niujin-beta/friend/returncity.process.php";var data="?province="+province+"&rand="+Math.random();var xmlhttp = getXMLHttpRequest();//alert(url+data);if(xmlhttp){xmlhttp.open("get", url+data, true);xmlhttp.onreadystatechange = function(){if (xmlhttp.readyState==4 && xmlhttp.status==200){var res=xmlhttp.responseText;var cities = eval("("+res+")");var city_node = $("city");if(city_node.length > 0){var len = city_node.length;//alert(city_node.childNodes[0]);for(index=0; index < len;index++){city_node.removeChild(city_node.firstChild);}}for(i in cities){city_node.style.display="block";var city = document.createElement("option");city.setAttribute("value", cities[i].en);city.appendChild(document.createTextNode(cities[i].ch));city_node.appendChild(city);}change_info_pos();change_tag_pos()//$("info").style.margin-left="180px";//$("info").style.margin-top="-30px";}}xmlhttp.send(null);}}function process(){document.getElementById("feedback").innerHTML="<img src='../image/loading.gif' width='30px'  />";}function search(){var user_info = getData();if(user_info == false) {return false;}var url = "/ciba/niujin-beta/friend/search.process.php";var data = "province="+user_info[0]+"&city="+user_info[1]+"&age="+user_info[2]+"&sex="+user_info[3]+"&tag="+user_info[4];var xmlhttp = getXMLHttpRequest();var user_info = document.getElementById("user_info");//alert(user_info.childNodes.length);if(user_info.childNodes.length > 0){for(index=0; index < user_info.childNodes.length; index++){user_info.removeChild(user_info.firstChild);}}if(xmlhttp){xmlhttp.open("get", url+'?'+data,true)//request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xmlhttp.onreadystatechange = function(){if (xmlhttp.readyState==4 && xmlhttp.status==200){var res=xmlhttp.responseText;var user_info = eval("("+res+")");//alert(user_info);for(i in user_info){//alert(user_info[i].name);var div = document.createElement("div");div.setAttribute("id", "user");if(user_info[i].name == 'none'){alert("对不起，没有你要找的用户");window.location.href="http://localhost/ciba/niujin-beta/friend/search_friend.html";}else{var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("姓名");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].name);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("性别");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].sex);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("年龄");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].age);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("QQ号");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].qq);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("住址");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].area);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("标签");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].tag);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span_content = document.createTextNode("宣言");label_span.appendChild(label_span_content);var name_span = document.createElement("span");var name_span_content  = document.createTextNode(user_info[i].intro);name_span.appendChild(name_span_content);p.appendChild(label_span);p.appendChild(name_span);div.appendChild(p);var p = document.createElement("p");var label_span = document.createElement("span");label_span.setAttribute("id","image");var image = document.createElement("img");image.setAttribute("src", user_info[i].image);label_span.appendChild(image);p.appendChild(label_span);div.appendChild(p);if(user_info[i].intro.length > 30){div.setAttribute("style", "width:680px; height: 230px;");label_span.setAttribute("style"," top:-223px; left:530px;");}else{div.setAttribute("style", "width:680px; height: 220px;");label_span.setAttribute("style"," top:-205px; left:530px;");}document.getElementById("user_info").appendChild(div);}}}}xmlhttp.send(null);}}function getData(){var user_info = new Array(5);//获取省份var province_name = $("province").options[$("province").selectedIndex].value;user_info[0] = province_name;if(user_info[0] == 'none'){$("province").setAttribute("style", "border: 1px #ff0000 solid");return false;}//获取城市var city_name = $("city").options[$("city").selectedIndex].value;user_info[1] = city_name;//获取年龄var user_age = $("age").value;user_info[2] = user_age;//获取性别var user_sex_list = document.getElementsByName("sex");var user_sex;for(i in user_sex_list){if(user_sex_list[i].checked == true){user_sex = user_sex_list[i].value;}}user_info[3] = user_sex;//获取特征值var user_tags_list = document.getElementsByName("tag");var user_tag= '';//alert(user_tags_list);for(i=0; i < user_tags_list.length; i++){if(user_tags_list[i].checked){user_tag += user_tags_list[i].value+'__';}}user_info[4] = user_tag.slice(0,-2);return user_info;}</script></head><body bgcolor="#RGB(67,65,65)"><!--搜索表单--><div id="search_area"><!--按地区搜索--><p id="area">地 区<select id="province" name="area" onchange="select_city(this.id);"><option value="none">省份</option><option value="hb">湖北</option><option value="hn">湖南</option><option value="gd">广东</option></select><select id="city" name="city"></select></p><!--按年龄搜索--><p id="info">年 龄<input type="text" name="age" id = "age" value="18" /><!--按性别搜索-->性 别<input type="radio" name="sex" value="男" checked="checked">男<input type="radio" name="sex" value="女">女<input type="radio" name="sex" value="*">保密</p><!--按特征搜索--><div id="tags"><span class="tname">特 征</span><div class="tag"><input type="checkbox" name="tag" value="美丽" checked>美丽<input type="checkbox" name="tag" value="善良">善良<input type="checkbox" name="tag" value="清纯">清纯<input type="checkbox" name="tag" value="知性">知性<br /><input type="checkbox" name="tag" value="贤惠">贤惠<input type="checkbox" name="tag" value="优雅">优雅<input type="checkbox" name="tag" value="成熟">成熟<input type="checkbox" name="tag" value="高挑">高挑<br /><input type="checkbox" name="tag" value="大方">大方<input type="checkbox" name="tag" value="活泼">活泼<input type="checkbox" name="tag" value="逗比">逗比<input type="checkbox" name="tag" value="犯二">犯二</div><input type="submit" value="搜索" style="width:52px; height:30px; position: relative; left:424px; top:-30px;" onclick="search();"/></div></div><!--返回的用户信息区域--><div id="user_info"></div></body></html>
0 0