Question

我创建了一个脚本，需要选择一个开始年份，然后才显示该年初的年份 - ＆gt; 2009年。这只是一个结束年度选择器的开始年份。

该脚本仅适用于firefox。我正在学习javascript，所以我希望有人能指出我正确的方向。可以在http://motolistr.com

找到实时脚本

<script type="text/javascript">
function display_year2(start_year) {
//alert(start_year);
if (start_year != "Any") {
    var i;
    for(i=document.form.year2.options.length-1;i>=0;i--)
    {
        document.form.year2.remove(i);
    }

    var x = 2009;
    while (x >= start_year) {
        var optn = document.createElement("OPTION");
        optn.text = x;
        optn.value = x;
        document.form.year2.options.add(optn);
        //alert(x);
        x--;
    }
}
else 
{
    var i;
    for(i=document.form.year2.options.length-1;i>=0;i--)
    {
        document.form.year2.remove(i);
    }
    var optn = document.createElement("OPTION");
    optn.text = "Any";
    optn.value = "Any";
    document.form.year2.options.add(optn);
} // end else
} // end function
</script>

有什么想法吗？

谢谢，尼克

Answer 1

您正尝试在每个选项上设置onclick事件。 IE不支持这一点。请尝试使用select元素中的onchanged事件。

而不是：

<select name="year1" id="year1">
    <option value="Any" onclick="javascript:display_year2('Any');" >Any</option>
    <option value="2009" onclick="javascript:display_year2(2009);" >2009</option>
    <option value="2008" onclick="javascript:display_year2(2008);" >2008</option>
</select>

试试这个：

<select name="year1" id="year1" onchange="javascript:display_year2(this.options[this.selectedIndex].value)">
    <option value="Any">Any</option>
    <option value="2009">2009</option>
    <option value="2008">2008</option>
</select>

Answer 2

它不起作用的原因不在您的代码段中：

<OPTION onclick=javascript:display_year2(2009); value=2009>

Option.onclick不是一般会被触发的事件，但在Firefox中也是如此。检测Select值更改的常用方法是通过Select.onchange。

此外，您不需要在事件处理程序中包含“javascript：”，它们不是URL（也是，永远不会使用javascript：URL）。另外，引用您的属性值;这总是一个好主意，当你开始在值中加入标点时，它是必需的。另外，坚持使用您的值的字符串 - 您使用Number调用display_year2，但option.value始终是String;尝试使用混合数据类型是一种混淆的方法。

总结：

<select onchange="display_year2(this.options[this.selectedIndex].value)">
    <option value="2009">2009</option>
    ...
</select>

其他事项：

var i;
for(i=document.form.year2.options.length-1;i>=0;i--)
{
document.form.year2.remove(i);
}

您可以通过写入options.length来取消循环。另外，最好避免直接从文档引用元素名称 - 使用document.forms []集合或getElmentById：

var year2= document.getElementById('year2');
year2.options.length= 0;

此外：

var optn = document.createElement("OPTION");
optn.text = x;
optn.value = x;
document.form.year2.options.add(optn);

HTMLCollection.add不是标准的DOM方法。传统的老派做法是：

year2.options[year2.options.length]= new Option(x, x);

Answer 3

我在Firefox中使用onchange时出现了类似的问题，但不是IE，有时候不是Chrome。我在下面添加了我的Head标签，一切都很好（放入元标记：我不得不剥掉此笔记的标签内容，以便显示出来） meta http-equiv =“X-UA-Compatible”content =“IE = edge，chrome = 1”

注意：它的作用是：始终强制使用最新的IE渲染引擎（即使在内联网中）＆amp; Chrome Frame BUT：如果您使用.htaccess

，请将其删除

Answer 4

谷歌搜索我在IE中发现了一些关于createElement问题的事情： http://webbugtrack.blogspot.com/2007/10/bug-235-createelement-is-broken-in-ie.html

还有一个指向具有变通方法的页面的链接。希望这会对你有所帮助。

Answer 5

虽然它不是你问题的解决方案;您以不正确的方式引用输入字段：document.form.year2应为document.getElementById('year2')。我还注意到你当前的脚本在Opera中运行。

Answer 6

尝试手动设置长度。

document.form.year2.options.length = number_of_items。

简单的javascript只能在FireFox中使用

6 个答案: