Почему мой JavaScript не работает в JSFiddle?


Я не могу выяснить, в чем проблема с этим JSFiddle.

HTML:

<input type="button" value="test" onclick="test()">

JavaScript:

function test(){alert("test");}

и когда я нажимаю на кнопку - ничего не произошло. Консоль говорит "тест не определен"

Я прочитал документацию JSFiddle-там говорится, что код JS добавляется в <head> и HTML код добавляется в <body> (Так что этот код JS является более ранним, чем html и должен работать).

7 103

7 ответов:

функция определена внутри обработчика нагрузки и, таким образом, находится в другой области. Как отмечает @ellisbben в комментариях, вы можете исправить это, явно определив его на

Если вы не укажете параметр wrap, по умолчанию он будет "onLoad". Это приводит к тому, что весь JavaScript упаковывается в функцию, выполняемую после загрузки результата. Все переменные являются локальными для этой функции, поэтому недоступны в глобальной области.

измените настройку обертывания на "без обертки", и она будет работать:

http://jsfiddle.net/zalun/Yazpj/1/

я переключил фреймворк на "нет библиотеки", так как вы ее не используете.

есть еще один способ, объявить свою функцию в переменную, как это:

test = function() {
  alert("test");
}

jsFiddle


подробности

редактировать (на основе комментариев @nnnnnn)

@nnnnnn:

почему говорят test = (без var) будет фиксировать ?

когда вы определяете такую функцию:

var test = function(){};

функция определен локально, но когда вы определяете свою функцию без var:

test = function(){};

test определен window объект, который находится в области верхнего уровня.

почему это работает?

как @zalun сказать :

если вы не укажете параметр wrap, по умолчанию он будет "onLoad". Это приводит к тому, что весь JavaScript упаковывается в функцию, выполняемую после загрузки результата. Все переменные являются локальными для этого таким образом, функция недоступна в глобальной области видимости.

но если вы используйте следующий синтаксис :

test = function(){};

у вас есть доступ к функции test потому что он определен глобально


ссылки :

измените параметр обертывания на панели фреймворки и расширения на " нет обертывания <body>"

нет никаких проблем с вашим кодом.Просто выберите расширение onLoad () с правой стороны.

<script> 
function test(){
 alert("test");   
}
</script>

<input type="button" value="test" onclick="test()">
Select OnDomready

HTML:

<input id="dButton" type="button" value="test"/>

JavaScript:

addEventListener('load', init, false);

function init()
{
  oInput = document.getElementById('dButton');
  oInput.onclick = test;
}

function test(){
  alert("test");
}