模仿某招聘網站下拉菜單-最新出爐

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="JavaScript" type="text/javascript">
//----------------------------
// 功能搜索選擇框
// 作者:Joshua
// Email:JoshuaChen[at]126.com
// webSite:www.xcopy.cn
//------------------------------
//省
var Data_Area_Province = new Array("安徽","北京","福建","甘肅","廣東","廣西","貴州","海南","河北","河南","黑龍江","湖北","湖南","吉林","江蘇","江西","遼寧","內蒙古","寧夏","青海","山東","山西","陝西","上海","四川","天津","西藏","新疆","雲南","浙江","重慶");
//市區
var Data_Area_City = new Array();
Data_Area_City[0] = new Array("安慶","蕪湖","宣城","亳州");
Data_Area_City[1] = new Array("北京");
Data_Area_City[2] = new Array("福州","三明","廈門","漳州");
Data_Area_City[3] = new Array("白銀","定西","天水","武威","張掖");
Data_Area_City[4] = new Array("潮州","東莞","佛山","廣州","肇慶","中山","珠海");
Data_Area_City[5] = new Array("百色","北海","河池","欽州","梧州","玉林");
Data_Area_City[6] = new Array("安順","畢節","貴陽","六盤水","銅仁","遵義");
Data_Area_City[7] = new Array("萬寧","文昌","五指山","儋州");
Data_Area_City[8] = new Array("保定","滄州","承德","邯鄲","唐山","邢臺","張家口");
Data_Area_City[9] = new Array("安陽","鶴壁","濟源","漯河","濮陽");
Data_Area_City[10]= new Array("大慶","大興安嶺","哈爾濱","雙鴨山","綏化","伊春");
Data_Area_City[11] = new Array("鄂州","黃岡","襄樊","孝感","宜昌");
Data_Area_City[12] = new Array("常德","長沙","岳陽","張家界","株洲");
Data_Area_City[13] = new Array("白城","白山","松原","通化");
Data_Area_City[14] = new Array("常州","淮安","無錫","徐州","鹽城","揚州","鎮江");
Data_Area_City[15] = new Array("撫州","上饒","新餘","宜春","鷹潭");
Data_Area_City[16] = new Array("鞍山","瀋陽","鐵嶺","營口");
Data_Area_City[17] = new Array("阿拉善盟","興安盟");
Data_Area_City[18] = new Array("固原","石嘴山","吳忠","銀川");
Data_Area_City[19] = new Array("果洛藏族自治州","西寧");
Data_Area_City[20] = new Array("濱州","德州","東營","濰坊","淄博");
Data_Area_City[21] = new Array("長治","大同","晉城","陽泉","運城");
Data_Area_City[22] = new Array("安康","寶雞","咸陽","延安","榆林");
Data_Area_City[23] = new Array("上海");
Data_Area_City[24] = new Array("阿壩藏族羌族自治州","雅安","宜賓","資陽","自貢","瀘州");
Data_Area_City[25] = new Array("天津");
Data_Area_City[26] = new Array("阿里","昌都","拉薩","林芝","那曲","日喀則","山南");
Data_Area_City[27] = new Array("阿克蘇","和田","喀什","吐魯番","伊犁哈薩克自治州");
Data_Area_City[28] = new Array("保山","玉溪","昭通");
Data_Area_City[29] = new Array("杭州","湖州","嘉興","金華","溫州","舟山","衢州");
Data_Area_City[30] = new Array("重慶");
//學歷
var Data_School = new Array("初中","高中","中專","大專","本科","雙學位");
//行業
var Data_Industry = new Array("計算機類","金融","財務類","美容保健類");
//時間
var Data_Date = new Array("今天","三天內","一個星期內","所有");

//層狀態
var Date_DivState=new Array()

//鼠標焦點狀態
var focusState=false
var Search = new Object();
//--------------------------------------
// 初始化Div標籤事件
// Joshua 2007-02-07
//--------------------------------------
Search.Init = function(){
document.getElementById("Data_Area").onclick = Search.ShowArea.Init;
document.getElementById("Data_School").onclick = Search.ShowSchool;
document.getElementById("Data_Industry").onclick = Search.ShowIndustry;
document.getElementById("Data_Date").onclick = Search.ShowDate;
}
//-------------------------------
// 創建一個Div對象
// Joshua 2007-02-07
//-------------------------------
Search.CreateDiv = function(obj,Id,X,Y,oWidth,oHeight){
var Obj_Div = document.createElement("div");
Obj_Div.setAttribute("id",Id);
Obj_Div.style.position="absolute";
Obj_Div.style.background="#fff";
Obj_Div.style.zIndex = "10000";
Obj_Div.style.border="1px solid #CCCCCC";
Obj_Div.style.padding="3px";
Obj_Div.style.lineHeight ="120%";
Obj_Div.style.left=X+"px";
Obj_Div.style.top=Y+"px";
Obj_Div.style.whiteSpace="nowrap";
Obj_Div.style.width= oWidth + "px";
// Obj_Div.style.height= oHeight + "px";
obj.appendChild(Obj_Div);
}
//------------------------------------
// 判斷Div是否存在
// Joshua 2007-02-07
//------------------------------------
Search.IsDiv = function(Id){
var result = true
try{
  document.getElementById(Id).a=1;
}catch(e){
  result = false
}
return(result);
}
//----------------------------
// 刪除Div對象
// Joshua 2007-02-07
//----------------------------
Search.RemoveDiv = function(Id){
try{
  if(navigator.appName.indexOf("Explorer") > -1){
   document.getElementById(Id).removeNode(true);
  }else{
   document.body.removeChild(document.getElementById(Id));
  }
}catch(e){}
}

//---------------------------
// 遍歷清除無用Div對象
// Joshua 2007-02-07
//---------------------------
Search.DelDiv = function(){
try{
 Search.RemoveDiv("Div_Area")
 document.getElementById("Data_Area").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_Area")).substring(1,Search.ReadTextContent(document.getElementById("Data_Area")).length);
}catch(e){}
try{
 Search.RemoveDiv("Div_School")
 document.getElementById("Data_School").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_School")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
}catch(e){}
try{
 Search.RemoveDiv("Div_Industry")
 document.getElementById("Data_Industry").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Div_Industry")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
}catch(e){}
try{
 Search.RemoveDiv("Div_Date")
 document.getElementById("Data_Date").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_Date")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
}catch(e){}
}
//--------------------------
// 失去焦點,清楚Div對象
// Joshua 2007-02-07
//--------------------------
Search.Lostfocus = function(){
if(!focusState){
 try{
 Search.RemoveDiv("Div_Area")
 document.getElementById("Data_Area").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_Area")).substring(1,Search.ReadTextContent(document.getElementById("Data_Area")).length);
 }catch(e){}
 try{
 Search.RemoveDiv("Div_School")
 document.getElementById("Data_School").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_School")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
 }catch(e){}
 try{
 Search.RemoveDiv("Div_Industry")
 document.getElementById("Div_Industry").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_Industry")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
 }catch(e){}
 try{
 Search.RemoveDiv("Div_Date")
 document.getElementById("Data_Date").innerHTML = "4" + Search.ReadTextContent(document.getElementById("Data_Date")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
 }catch(e){}
}
}
Search.ShowArea = function(){}
//------------------------
// 顯示地區一級菜單
// Joshua 2007-02-07
//------------------------
Search.ShowArea.Init = function(){
focusState = true;
Search.DelDiv()//刪除其他DIV標籤
if(!Search.IsDiv("Div_Area")){
 //更改Data_Area對象內容
 document.getElementById("Data_Area").innerHTML ="6"+ Search.ReadTextContent(document.getElementById("Data_Area")).substring(1,Search.ReadTextContent(document.getElementById("Data_Area")).length);
 //顯示層
 Search.CreateDiv(document.body,"Div_Area",Search.getSelectPosition(document.getElementById("Data_Area"))[0],Search.getSelectPosition(document.getElementById("Data_Area"))[1]+12,80,0);
 //創建省級分類
 for(var i=0;i<Data_Area_Province.length;i++){
 var Obj_Span = document.createElement("div");
 Obj_Span.setAttribute("id","Div_Area_Province_"+i);
 Obj_Span.setAttribute("name",i);
 Obj_Span.style.cursor="pointer";
 Obj_Span.onmouseover = function(){
 focusState = true;
 this.style.border="1px solid #827C5F";
 this.style.background="#CEC497";
 }
 Obj_Span.onmouseout = function(){
 focusState = false;
 if (!Date_DivState[this.getAttribute("value")]){
 this.style.border="0px solid #ffffff";
 this.style.background="#fff";}
 }
 Obj_Span.onclick = function(){
 focusState = true;
 //恢復非本對象的其他一級菜單項目樣式
 for(var i=0;i<Date_DivState.length;i++){
 if(Date_DivState[i]==true&&this.value!=document.getElementById("Div_Area_Province_"+i).name){
 document.getElementById("Div_Area_Province_"+i).style.border="0px solid #ffffff";
 document.getElementById("Div_Area_Province_"+i).style.background="#fff";
 }
 }
 //設置層狀態
 Date_DivState[this.getAttribute("name")] = true;

 //生成二級菜單
 Search.ShowArea.InitCity(this.getAttribute("name"),this)
 }
 Obj_Span.innerHTML = Data_Area_Province[i] + "4";
 document.getElementById("Div_Area").appendChild(Obj_Span);
 }
}
}
//----------------------
// 顯示地區二級菜單
// Joshua 2007-02-07
//----------------------
Search.ShowArea.InitCity = function(oId,obj){
if(!Search.IsDiv("Div_Area_City_"+oId)){
 //刪除除對象外存在的二級菜單對象
 for(var i=0;i<Date_DivState.length;i++){
 if(Date_DivState[i]==true&&i!=oId){
 Search.RemoveCityDiv("Div_Area_Province_"+i,"Div_Area_City_"+i);
 Date_DivState[i]=null;
 }
 }
 //生成指定的二級菜單對象
 Search.CreateDiv(obj,"Div_Area_City_"+oId,obj.offsetWidth,obj.offsetTop,50,0);

 if(oId<Data_Area_Province.length){
 for(var i=0;i<Data_Area_City[oId].length;i++){
 var Obj_Span = document.createElement("div");
 Obj_Span.setAttribute("id","Div_Area_City"+i);
 Obj_Span.style.cursor="pointer";
 Search.SetTextContent(Obj_Span,Data_Area_City[oId][i]);
 Obj_Span.setAttribute("value",oId);
 Obj_Span.onmouseover = function(){
 focusState = true;
 this.style.border="1px solid #827C5F";
 this.style.background="#CEC497";
 }
 Obj_Span.onmouseout = function(){
 focusState = false;
 this.style.border="0px";
 this.style.background="#fff";
 }
 Obj_Span.onclick = function(){
 //設置Data_Area的對象爲選擇的職
 document.getElementById("Data_Area").innerHTML = "4" + Search.ReadTextContent(this);
 //設置Input值
 document.getElementById("Input_Area").value = Search.ReadTextContent(this);
 document.getElementById("Input_Area_P").value = Data_Area_Province[this.getAttribute("value")];
 //刪除Div對象
 Search.RemoveDiv("Div_Area");
 //恢復狀態數組
 Date_DivState.length=0;
 }
 document.getElementById("Div_Area_City_"+oId).appendChild(Obj_Span);
 }
 }
}

}
//----------------------------
// 刪除Div對象
// Joshua 2007-02-07
//----------------------------
Search.RemoveCityDiv = function(Id,CId){
try{
 if(navigator.appName.indexOf("Explorer") > -1){
 document.getElementById(CId).removeNode(true);
 }else{
 document.getElementById(Id).removeChild(document.getElementById(CId));
 }
}catch(e){}
}
//-------------------
// 學歷Div操作
// Joshua 2007-02-07
//-------------------
Search.ShowSchool=function(){
focusState = true;
Search.DelDiv();//刪除其他DIV標籤
if(!Search.IsDiv("Div_School")){
 document.getElementById("Data_School").innerHTML = "6" + Search.ReadTextContent(document.getElementById("Data_School")).substring(1,Search.ReadTextContent(document.getElementById("Data_School")).length);
 Search.CreateDiv(document.body,"Div_School",Search.getSelectPosition(document.getElementById("Data_School"))[0],Search.getSelectPosition(document.getElementById("Data_School"))[1]+12,60,0);
 for(var i=0;i<Data_School.length;i++){
 var Obj_Span = document.createElement("div");
 Obj_Span.setAttribute("id","Div_School_"+i);
 Obj_Span.setAttribute("value",i);
 Obj_Span.style.cursor="pointer";
 Obj_Span.onmouseover = function(){
 focusState = true;
 this.style.border="1px solid #827C5F";
 this.style.background="#CEC497";
 }
 Obj_Span.onmouseout = function(){
 focusState = false;
 this.style.border="0px";
 this.style.background="#fff";
 }
 Obj_Span.onclick = function(){
 document.getElementById("Data_School").innerHTML = "4" + Search.ReadTextContent(this);
 document.getElementById("Input_School").value = Search.ReadTextContent(this);
 Search.RemoveDiv("Div_School");
 }
 Obj_Span.innerHTML = Data_School[i];
 document.getElementById("Div_School").appendChild(Obj_Span);
 }
}
}
//----------------------
// 行業Div操作
// Joshua 2007-02-07
//----------------------
Search.ShowIndustry = function(){
focusState = true;
Search.DelDiv();//刪除其他DIV標籤
if(!Search.IsDiv("Div_Industry")){
 document.getElementById("Data_Industry").innerHTML = "6" + Search.ReadTextContent(document.getElementById("Data_Industry")).substring(1,Search.ReadTextContent(document.getElementById("Data_Industry")).length);
 Search.CreateDiv(document.body,"Div_Industry",Search.getSelectPosition(document.getElementById("Data_Industry"))[0],Search.getSelectPosition(document.getElementById("Data_Industry"))[1]+12,160,0);
 for(var i=0;i<Data_Industry.length;i++){
 var Obj_Span = document.createElement("div");
 Obj_Span.setAttribute("id","Div_Industry_"+i);
 Obj_Span.setAttribute("value",i);
 Obj_Span.style.cursor="pointer";
 Obj_Span.onmouseover = function(){
 focusState = true;
 this.style.border="1px solid #827C5F";
 this.style.background="#CEC497";
 }
 Obj_Span.onmouseout = function(){
 focusState = false;
 this.style.border="0px";
 this.style.background="#fff";
 }
 Obj_Span.onclick = function(){
 document.getElementById("Data_Industry").innerHTML = "4" + Search.ReadTextContent(this);
 document.getElementById("Input_Industry").value = Search.ReadTextContent(this);
 Search.RemoveDiv("Div_Industry");
 }
 Obj_Span.innerHTML = Data_Industry[i];
 document.getElementById("Div_Industry").appendChild(Obj_Span);
 }
}
}
//-----------------------------
// 時間Div操作
// Joshua 2007-02-07
//-----------------------------
Search.ShowDate = function(){
focusState = true;
Search.DelDiv();//刪除其他DIV標籤
if(!Search.IsDiv("Div_Date")){
 document.getElementById("Data_Date").innerHTML = "6" + Search.ReadTextContent(document.getElementById("Data_Date")).substring(1,Search.ReadTextContent(document.getElementById("Data_Date")).length);
 Search.CreateDiv(document.body,"Div_Date",Search.getSelectPosition(document.getElementById("Data_Date"))[0],Search.getSelectPosition(document.getElementById("Data_Date"))[1]+12,60,0);
 for(var i=0;i<Data_Date.length;i++){
 var Obj_Span = document.createElement("div");
 Obj_Span.setAttribute("id","Div_Date_"+i);
 Obj_Span.setAttribute("value",i);
 Obj_Span.style.cursor="pointer";
 Obj_Span.onmouseover = function(){
 focusState = true;
 this.style.border="1px solid #827C5F";
 this.style.background="#CEC497";
 }
 Obj_Span.onmouseout = function(){
 focusState = false;
 this.style.border="0px";
 this.style.background="#fff";
 }
 Obj_Span.onclick = function(){
 document.getElementById("Data_Date").innerHTML = "4" + Search.ReadTextContent(this);
 document.getElementById("Input_Date").value = Search.ReadTextContent(this);
 Search.RemoveDiv("Div_Date");
 }
 Obj_Span.innerHTML = Data_Date[i];
 document.getElementById("Div_Date").appendChild(Obj_Span);
 }
}
}
Search.SetTextContent = function(Obj,Content){
if(navigator.appName.indexOf("Explorer") > -1){
 Obj.innerText = Content;
} else{
 Obj.textContent = Content;
}
}
Search.ReadTextContent = function(Obj){
if(navigator.appName.indexOf("Explorer") > -1){
 return(Obj.innerText);
} else{
 return(Obj.textContent)
}
}
//-----------------------
// 獲取一個對象的座標
//------------------------
Search.getSelectPosition = function(Gobj) {
var objLeft = Gobj.offsetLeft;
var objTop = Gobj.offsetTop;
var objParent = Gobj.offsetParent;
while (objParent!= null) {
 objLeft += objParent.offsetLeft;
 objTop += objParent.offsetTop;
 objParent = objParent.offsetParent;
}
return([objLeft,objTop]);
}
//------------------------
// 頁面初始化
//------------------------
window.onload=function(){
Search.Init();
}
window.document.onclick=function (){
Search.Lostfocus();
}
</script>
<style>
BODY{FONT-SIZE: 12px;}
</style>
</head>

模仿某招聘網站下拉菜單-最新出爐

《Python進階》學習筆記

Leetcode 3161. 物塊放置查詢

一個docker容器暴露多個端口

leetcode 60 排列序列

微服務實踐之使用 Visual Studio 2022 調試Dapr 應用程序

wpf附加屬性理解 WPF附加屬性

對聯效果

.listView類

選項卡四

QQ菜單效果

選項卡　六

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結