为什么这个变化不起作用

why dosn't this onchange work

本文关键字：不起作用 变化 为什么      更新时间：2023-09-26

我正在尝试在js中解决一个简单的问题。我不知道为什么没有调用我的速度方法。我插入了 console.log（） 来检查其他所有方法是否都有效，结果确实如此。我已经插入了来自html和js的代码。这是一个选择列表，如果我选择不同的值，应该调用速度方法，但它永远不会。任何帮助，不胜感激。

(function() {
"use strict";
window.onload = function() {
    document.getElementById("startbutton").onclick = displayWords;
    document.getElementById("stopbutton").onclick =  stop;  
    document.getElementById("speedMenu").onchange = speed;
};
var timer = null;
var speed = 171;
var count = 0;

function displayWords() {
    console.log(" displayWords is called");
    document.getElementById("stopbutton").disabled = false;
    document.getElementById("startbutton").disabled = true;
    document.getElementById("stopbutton").classList.remove("buttonBehaviour");
    document.getElementById("startbutton").classList.add("buttonBehaviour");
    document.getElementById("input").disabled = true;
    timer = setInterval(display,speed,punctuation());
}
function stop() {
    console.log(" stop is called");
    document.getElementById("startbutton").disabled = false;
    document.getElementById("stopbutton").disabled = true;
    document.getElementById("stopbutton").classList.add("buttonBehaviour");
    document.getElementById("startbutton").classList.remove("buttonBehaviour");
    document.getElementById("display").innerHTML = "";
    clearInterval(timer);
    document.getElementById("input").disabled = false;
    count = 0;
}
function speed() {
    console.log(" speed is called");
    var value = document.getElementById("speedMenu").options[document.getElementById("speedMenu")].value;
    console.log(value);
    clearInterval(timer);
    var list = punctuation();
    for(var i = 0; i < count ;i++) {
        list.shift();
    }
    timer = setInterval(display,value,list);
}
function punctuation () {
    console.log(" pun is called");
    var words = document.getElementById("input").value.split(/[ 't'n]+/);
    var list = [];
    for (var i = 0; i < words.length; i++) {
        var word = words[i];
        var lastChar = word.charAt(word.length - 1);
        if(lastChar === "," || lastChar === "." || lastChar === "!" || lastChar === "?" || lastChar === ";" || lastChar === ":") {
            word = word.substring(0,word.length - 1);
            list.push(word);
            list.push(word);
        } else {
            list.push(word);
        }
    };
    return list;
}
function display(words) {
    count++;
    console.log(" display  is called");
        document.getElementById("display").innerHTML = words.shift();
        if(document.getElementById("med").checked) {
            document.getElementById("display").style.fontSize = "36pt";
        } else if(document.getElementById("big").checked) {
            document.getElementById("display").style.fontSize = "48pt";
        } else if(document.getElementById("bigger").checked) {
            document.getElementById("display").style.fontSize = "60pt";
        }
        if( words.length == 0) {
            clearInterval(timer);
        }
}
}) ();

标记和方法遵循 HTML 代码 

<select id = "speedMenu">
                <option value = "500">50 wpm</option>
                <option value = "200">300 wpm</option>
                <option value = "171" selected="selected">350 wpm</option>
                <option value = "150">400 wpm</option>
                <option value = "133">450 wpm</option>
                <option value = "120">500 wpm</option>
            </select>

你有一个名为 speed 的变量和一个名为 speed 的函数。您有名称冲突。

这是代码的最小示例：

window.onload = function () {
    console.log(speed);  
};
var speed = 171;
function speed(){
}

相关文章：