Ошибка "Ожидаемая функция" в IE: '<input onclick = "start();"... '

Существует фрагмент HTML:

<input onclick="start();" type="button" value="Start!"/>

В Firefox и Chrome он вызывает start при щелчке. Однако в IE9 он выдает сообщение об ошибке: SCRIPT5002: Function expected. Затем я попробовал несколько разных случаев:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <script>
        function start(){
            alert("Let start");
        }
        function stop(){
            alert("Let stop");
        }
    </script>
    <input onclick="start();" type="button" value="Start!"/><br/> <!-- Failed : the main issue -->
    <span onclick="start();">Start!</span><br/> <!-- Work -->
    <input onclick="stop();" type="button" value="Stop!"/><br/> <!-- Work -->
    <input onclick="start();" type="text" value="Start!"/><br/> <!-- Failed -->
    <input onmouseover="start();" type="button" value="Start!"/><br/> <!-- Failed -->
</body>
</html>

Исходный случай: Failed _{(Вот почему я здесь.)}
Используйте span вместо input: Успех
Используйте другое имя функции: Success
Использовать другой тип: Failed
Используйте onmouseover вместо onclick: Failed

Я использовал отладчик, и он сказал, что start есть function start(){alert("Let start");}. Затем я использовал alert(start) и сказал fileopen.

В результате теста 3 я могу легко обходиться, изменяя имя, но я хочу знать , почему эта ошибка произошла в некоторых случаях, но не в других. _{Изменить:} Или следующее лучшее, другие обходы без изменения имен.

Ответ 1

start является свойством элементов input в IE. (По словам Microsoft, он указывает, "когда файл видеоклипа должен начать играть." Я понятия не имею, что это значит, но это не важно.) В консоли, вы можете увидеть это, выполнив:

> document.createElement("input").start
"fileopen"

В обработчике событий inline элементов все свойства этого элемента доступны как переменные верхнего уровня. Как будто встроенный код запускается внутри блока with(thisParticularElement) (где thisParticularElement - это элемент со слушателем, очевидно). Следовательно, в контексте встроенного кода события переменная start относится к свойству start элемента, который является строкой, а не функцией.

Просто измените имя функции или явно используйте window.start.

Ответ 2

Это интересно. Я сделал несколько тестов самостоятельно, и кажется, что эта ошибка происходит, поскольку start уже имеет свойство элемента ввода. Поэтому он попытается вызвать свойство, а не функцию.

Я считаю это ошибкой.

Попробуйте выполнить следующий код:

<script>
        function autocomplete(){
            alert("");
        }
        function vspace(){
            alert("");
        }
        function hspace(){
            alert("");
        }


    </script>

<input id="error" onclick="autocomplete();" type="button" value="Start!"/>
<input id="error2" onclick="vspace();" type="button" value="Start!"/>
<input id="error3" onclick="hspace();" type="button" value="Start!"/>

Затем попробуйте отладить консоль. Также попробуйте var x = document.getElementById("error");, а затем отлаживайте свойства x.

Я тестировал это в IE8, IE9 и IE10. Эти функции не работают в IE9 и IE10 (Win 7 32bit).