هذا اختيار مخصص للبيانات المنسدلة يقلد CTRIP ، والذي يصف بعض المعلمات الأكثر أهمية ، وهو مريح للمبتدئين
/ *. tag*/ function yselect (id ، ydata ، bool ، config ، fn) {var data = [] ؛ yselect_close = {} ؛ var name_list = {a: [] ، b: [] ، c: [] ، d: [] ، e: [] ، f: [] ، g: [] ، h: [] ، i: [] ، j: [] ، k: [] ، l: [] ، m: [] ، o: [] ، p: [] ، q: [] ، r: [] ، s: [] ، t: [] ، u: [] ، v: [] ، w: [] ، x: [] ، y: [] ، z: [] ، others: []} // إنشاء صفيف جديد لمنع var ydropdowns غير المحدد = document.getElementById (id) ؛ دالة المعالجة () {// Process Data var catalogdata = [] ؛ var BrandData = [] ؛ var China = [] ؛ var foreign = [] ؛ لـ (var i in ydata) {if (ydata [i] [config.type] == null) catalogdata.push (ydata [i] [config.id]+'؛'+ydata [i] [config.name]+'؛'+ydata [i] BrandData.push (ydata [i] [config.id]+'؛'+ydata [i] [config.name]+'؛'+ydata [i] [config.type])} ؛ if (brandData! = "") {for (var i = 0 ؛ i <branddata.length ؛ i ++) {var str = brandData [i] .split ('؛') if (str [3] == 0) China.push (str [0] + '؛' + str [1] + '؛' else foreign.push (str [0] + '؛' + str [1] + '؛' + str [2]) ؛ } if (bool) {data = China ؛ إرجاع البيانات ؛ } آخر {data = أجنبي ؛ إرجاع البيانات ؛ }} آخر {data = catalogdata ؛ إرجاع البيانات ؛ // return data}} ؛ الدالة jSondata (data_name ، ida) {// معالجة البيانات التي يتم إرجاعها بواسطة Titleratment var title = [] ؛ // تحديد الحرف الأولي var ahtml = {a: [] ، b: [] ، c: [] ، d: [] ، e: [] ، f: [] ، g: [] ، h: [] ، i: [] ، j: [] ، k: [] ، l: [] ، m: [] ، o: [] ، p: [] ، q: [] ، r: [] ، s: [] ، t: [] ، u: [] ، v: [] ، w: [] ، x: [] ، y: [] ، z: [] ، others: []} ؛ // إنشاء صفيف جديد لمنع var yselect_box غير المحدد = document.createElement ("div") ؛ // قم بإنشاء عنصر مصلحة جديد yselect_box.id = ida+"_ yselect_box" ؛ var yselect_div = document.createElement ("div") ؛ // حاوية مع قيمة إرجاع الحروف var yselect_letter = document.createElement ("p") ؛ // 26 حرف حاوية yselect_letter.id = ida+'_ yselect_letter' var stylelink = document.createElement ("style") // إنشاء الجلد ، مع مجموعتين من الجلود للاختيار من //stylelink.innerhtml =#'+id+' _ yselect_box {width: 100 ٪ ؛ الموضع: المطلق ؛ أعلى: 30px ؛ اليسار: 0 ؛ z-index: 9999 ؛ الخلفية: #ffff}#'+id+' _ yselect_box p {background:#469bde ؛ padding: 0 10px ؛}#'+id+' _ yselect_box p span.close {font: Yahei ؛ المؤشر: مؤشر ؛ الموضع: المطلق ؛ أعلى: 0 ؛ اليمين: 0 ؛ اللون:#f00}#'+id+' _ yselect_box .hide_tag {الحدود: 1px solid#469bde ؛ padding: 5px ؛ عرض: لا شيء ؛ min-height: 100px ؛ max-height: 300px ؛ min-width: 300px ؛ max-width: 800px ؛ overflow: auto}#'+id+' _ yselect_box pa {padding: 5px ؛ line-height: 28px ؛ color: #fff}#'+id+' _ A {Width: 80px ؛ display: block ؛ decoration text: none ؛ padding: 5px ؛ line-line: 12px ؛ font-size: 12px ؛ float: left ؛ color:#444 ؛ verflow: hidden ؛ Text-Overflow: Ellipsis ؛ White-Space: nowrap ؛}#'+id+' _ yselect_box .hide_tag a: hover {background:#469bde ؛ color: #fff ؛}#'+id+' _ yselect_box .cur stylelink.innerhtml = '#'+ida+'_ yselect_box {width: 100 ٪ ؛ min-width: 500px ؛ max-width: 800px ؛ position: absolute ؛ top: 30px ؛ left: 0 ؛ z-index: 9999 ؛ background ؛ p {padding: 0 10px ؛}#'+ida+' _ yselect_box p span.close {font: 16px/20px microsoft yahei ؛ cursor: pointer ؛ position: apport ؛ top: 0 ؛ right: 0 ؛ color:#666}#'+ida+' _ yselect_box لا شيء ؛ min-height: 50px ؛ max-height: 200px ؛ overflow: Auto}#'+ida+' _ yselect_box pa {padding: 5px ؛ line-height: 28px ؛ color:#333 ؛ border-bottom: 2px solid #bbb ؛ A {Width: 80px ؛ display: block ؛ decoration text: none ؛ padding: 5px ؛ line-line: 12px ؛ font-size: 12px ؛ float: left ؛ color:#444 ؛ verflow: hidden ؛ text-overflow: ellipsis ؛ White-Space: nowrap ؛}#'+ida+' _ yselect_box .hide_tag a: hover {background:#469bde ؛ color: #fff ؛}#'+ida+' _ yselect_box a.cur {border-bottom: 2px#469bde ؛ لـ (var i = 0 ؛ i <data_name.length ؛ i ++) {var str = data_name [i] .split ('؛') title.push (str [2] .charat (0) .TolocaleupperCase ()) / لـ (var j in title) {if (name_list [tit [j]]) name_list [tit [j]]. push (data_name [j]) ؛ else name_list.other.push (data_name [j])} // إدراج البيانات في name_list لـ (var k في name_list) {// البيانات ، افصل عن طريق الحروف ، إخفاء if (name_list [k] .length! = 0) {for (var i = 0 ؛ i name_list [k] onClick = "' + fn +' (this)" name = "' + name_list [k] ahtml [k] += allhtml ؛ } ؛ yselect_letter.innerhtml+= '<a href = "javaScript:">'+k+'</a>' ؛ yselect_div.innerhtml+= '<viv>'+ahtml [k]+'</viv>' ؛ } ؛ } var bool = true yselect_box.innerhtml = '<p id = "'+ida+'_ yselect_letter'+'">'+yselect_letter.innerhtml+'<span> x </p> </p>'+yselect_div.innerhtml ؛ ydropdowns.appendchild (yselect_box) ؛ ydropdowns.appendchild (Stylelink) ؛ // إدراج حدد في الصفحة yselect_box.getelementsbytagname ('p') [0] .getElementsByTagName ('span') [0] .onclick = function yselect_close () {ydropdowns.removechild (ysleect_box) bool = false} // انقر لتدمير تحديد yselect_close.close = function yselect_close (obool) {if (obool) {ydropdowns.removechild (yselect_box) ydropdowns.removechild (stylelink) ؛ bool = عودة خاطئة} ؛ if (bool) {ydropdowns.removechild (yselect_box) ydropdowns.removechild (stylelink) ؛ }} // تدمير وظيفة تحديد الإرجاع yselect_close} jsondata (المعالجة () ، معرف) navlist (id) وظيفة navlist (ids) {// tab tab function var a = document.getElementById (ids+'_ ysleect_letter'). getElementBytagname ('a') ؛ var div = document.getElementById (ids+'_ yselect_box'). getElementsByTagName ('div') ؛ div [0] .style.display = "block" ؛ a [0] .className = "cur" ؛ لـ (var i = 0 ؛ i <a.length ؛ i ++) {a [i] .index = i ؛ a [i] .onclick = function () {for (var j = 0 ؛ j <a.length ؛ j ++) {div [j] .style.display = "none" ؛ a [j] .className = "" ؛ } ؛ div [this.index] .style.display = "block" ؛ this.className = "cur"} ؛ } ؛ } ؛ } ؛ } ؛