Heim  >  Artikel  >  Web-Frontend  >  Sekundärer Verknüpfungseffekt der Dropdown-Box, implementiert durch js_javascript-Kenntnisse

Sekundärer Verknüpfungseffekt der Dropdown-Box, implementiert durch js_javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 15:02:591165Durchsuche

Das Beispiel in diesem Artikel beschreibt den sekundären Verknüpfungseffekt der von js implementierten Dropdown-Box. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

<script language="JavaScript" type="text/javascript">
<!--
/*
 * 说明:将指定下拉列表的选项值清空
 * 转自:Gdong Elvis ( http://www.gdcool.net )
 *
 * @param {String || Object]} selectObj 目标下拉选框的名称或对象,必须
 */
 function removeOptions(selectObj)
 {
 if (typeof selectObj != 'object')
 {
 selectObj = document.getElementById(selectObj);
 }
 // 原有选项计数
 var len = selectObj.options.length;
 for (var i=0; i < len; i++) {
 // 移除当前选项
 selectObj.options[0] = null;
 }
 }
 /*
 * @param {String || Object]} selectObj 目标下拉选框的名称或对象,必须
 * @param {Array} optionList 选项值设置 格式:[{txt:'北京', val:'010'}, {txt:'上海', val:'020'}] ,必须
 * @param {String} firstOption 第一个选项值,如:“请选择”,可选,值为空
 * @param {String} selected 默认选中值,可选
 */
 function setSelectOption(selectObj, optionList, firstOption, selected) {
 if (typeof selectObj != 'object')
 {
 selectObj = document.getElementById(selectObj);
 }
 // 清空选项
 removeOptions(selectObj);
 // 选项计数
 var start = 0;
 // 如果需要添加第一个选项
 if (firstOption) {
 selectObj.options[0] = new Option(firstOption, '');
 // 选项计数从 1 开始
 start ++;
 }
 var len = optionList.length;
 for (var i=0; i < len; i++) {
 // 设置 option
 selectObj.options[start] = new Option(optionList[i].txt, optionList[i].val);
 // 选中项
 if(selected == optionList[i].val)  {
 selectObj.options[start].selected = true;
 }
 // 计数加 1
 start ++;
 }
 }
 //-->
</script>
<script language="JavaScript" type="text/javascript">
var cityArr = [];
cityArr['江苏省'] =
[
 {txt:'南京', val:'南京'},
 {txt:'无锡', val:'无锡'},
 {txt:'徐州', val:'徐州'},
 {txt:'苏州', val:'苏州'},
 {txt:'南通', val:'南通'},
 {txt:'淮阴', val:'淮阴'},
 {txt:'扬州', val:'扬州'},
 {txt:'镇江', val:'镇江'},
 {txt:'常州', val:'常州'}
 ];
cityArr['浙江省'] =
[
 {txt:'杭州', val:'杭州'},
 {txt:'宁波', val:'宁波'},
 {txt:'温州', val:'温州'},
 {txt:'湖州', val:'湖州'}
 ];
function setCity(province)
{
 setSelectOption('city', cityArr[province], '-请选择-');
}
</script>
 <select name="province" id="province" onchange="if(this.value != '') setCity(this.options[this.selectedIndex].value);">
 <option value="">-请选择-</option>
 <option value="江苏省">江苏省</option>
 <option value="浙江省">浙江省</option>
 </select>
 省
 <select name="city" id="city">
 <option value="">-请选择-</option>
 </select>
 市

PS: Hier empfehlen wir ein sehr einfach zu bedienendes JavaScript-Komprimierungs-, Formatierungs- und Verschlüsselungstool mit sehr leistungsstarken Funktionen:

JavaScript-Komprimierungs-/Formatierungs-/Verschlüsselungstool: http://tools.jb51.net/code/jscompress

Die Verschlüsselungsfunktion im oben genannten JS-Tool kann die Evaluierungsfunktionsverschlüsselungsform von JS-Code realisieren. In diesem Zusammenhang bietet diese Site auch das folgende Entschlüsselungstool für die Evaluierungsfunktionsverschlüsselung, das sehr leistungsstark ist praktisch!

JS-Bewertungsmethode Online-Verschlüsselungs- und Entschlüsselungstool: http://tools.jb51.net/password/evalencode

Weitere JavaScript-bezogene Inhalte finden Sie in den Spezialthemen auf dieser Website: „Zusammenfassung der JavaScript-Switching-Spezialeffekte und -Techniken“, „Zusammenfassung der JavaScript-Suchalgorithmustechniken“ , „JavaScript-Animation – Zusammenfassung von Spezialeffekten und Techniken“, „Zusammenfassung von JavaScript-Fehlern und Debugging-Techniken“, „Zusammenfassung von JavaScript-Datenstrukturen und Algorithmustechniken“ , „Zusammenfassung der JavaScript-Traversal-Algorithmen und -Techniken “ und „Zusammenfassung der Verwendung mathematischer JavaScript-Operationen

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der JavaScript-Programmierung befassen.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn