- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我按照本指南设置了一个双下拉菜单:http://coursesweb.net/javascript/multiple-select-dropdown-list-javascript_t#doublesl
我添加了自己的选项,似乎第二个下拉列表不再显示。为什么会这样?
<!-- The first select list -->
Select WebSite: <select name="slist1" onchange="SList.getSelect('slist2', this.value);">
<option>- - -</option>
<option value="amazon">Amazon</option>
<option value="apple">Apple</option>
<option value="keurig">Keurig</option>
<option value="nike">Nike</option>
</select>
<!-- Tags for the seccond dropdown list, and for text-content -->
<span id="slist2"></span> <div id="scontent"></div>
<script><!--
/* Script Double Select Dropdown List, from: coursesweb.net/javascript/ */
var SList = new Object(); // JS object that stores data for options
// HERE replace the value with the text you want to be displayed near Select
var txtsl2 = 'Select Category:';
/*
Property with options for the Seccond select list
The key in this object must be the same with the values of the options added in the first select
The values in the array associated to each key represent options of the seccond select
*/
SList.slist2 = {
"amazon": ['kindle fire hd', 'kindle charger', 'kindle fire hd'],
"apple": ['macbook', 'imac', 'iphone', 'ipad']
"keurig": ['platinum', 'vue']
"nike": ['fuel band']
};
/*
Property with text-content associated with the options of the 2nd select list
The key in this object must be the same with the values (options) added in each Array in "slist2" above
The values of each key represent the content displayed after the user selects an option in 2nd dropdown list
*/
SList.scontent = {
"kindle fire hd": 'www.marplo.net/ajax/',
"kindle charger": 'www.marplo.net/jocuri/',
"kindle fire hd": 'www.marplo.net/anime/',
"macbook": 'coursesweb.net/php-mysql/',
"imac": 'coursesweb.net/javascript/',
"iphone": 'coursesweb.net/flash/',
"ipad": 'www.marplo.net/ajax/',
"platinum": 'www.marplo.net/jocuri/',
"vue": 'www.marplo.net/anime/',
"fuelband": 'coursesweb.net/php-mysql/'
};
/* From here no need to modify */
// function to get the dropdown list, or content
SList.getSelect = function(slist, option) {
document.getElementById('scontent').innerHTML = ''; // empty option-content
if(SList[slist][option]) {
// if option from the last Select, add text-content, else, set dropdown list
if(slist == 'scontent') document.getElementById('scontent').innerHTML = SList[slist][option];
else if(slist == 'slist2') {
var addata = '<option>- - -</option>';
for(var i=0; i<SList[slist][option].length; i++) {
addata += '<option value="'+SList[slist][option][i]+'">'+SList[slist][option][i]+'</option>';
}
document.getElementById('slist2').innerHTML = txtsl2+' <select name="slist2" onchange="SList.getSelect(\'scontent\', this.value);">'+addata+'</select>';
}
}
else if(slist == 'slist2') {
// empty the tag for 2nd select list
document.getElementById('slist2').innerHTML = '';
}
}
--></script>
最佳答案
对控制台的简单检查将显示您有语法错误。当出现问题时,第一步是检查 JavaScript 错误!
SList.slist2
对象中缺少逗号,该逗号分隔数组(或哈希表,如果您愿意)中的对象
你想要:
SList.slist2 = {
"amazon": ['kindle fire hd', 'kindle charger', 'kindle fire hd'],
"apple": ['macbook', 'imac', 'iphone', 'ipad'],
"keurig": ['platinum', 'vue'],
"nike": ['fuel band']
};
关于javascript - HTML/Javascript 双下拉菜单不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22951138/
今天有小伙伴给我留言问到,try{...}catch(){...}是什么意思?它用来干什么? 简单的说 他们是用来捕获异常的 下面我们通过一个例子来详细讲解下
我正在努力提高网站的可访问性,但我不知道如何在页脚中标记社交媒体链接列表。这些链接指向我在 facecook、twitter 等上的帐户。我不想用 role="navigation" 标记这些链接,因
说现在是 6 点,我有一个 Timer 并在 10 点安排了一个 TimerTask。之后,System DateTime 被其他服务(例如 ntp)调整为 9 点钟。我仍然希望我的 TimerTas
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我就废话不多说了,大家还是直接看代码吧~ ? 1
Maven系列1 1.什么是Maven? Maven是一个项目管理工具,它包含了一个对象模型。一组标准集合,一个依赖管理系统。和用来运行定义在生命周期阶段中插件目标和逻辑。 核心功能 Mav
我是一名优秀的程序员,十分优秀!