Это ключевое слово не работает

Question

Я пытаюсь понять, как ключевое слово this работает в JavaScript, и я сделал этот скрипт:

function click(){
    this.innerHTML="changed";
}

Используется в этом HTML:

<button id="clicker" onclick="click()" >Click me</button> 

Но это неКто-нибудь может объяснить, почему?

Answer 1

this существует только в рамках самого события onclick. Он не связан автоматически с другими функциями.

Передайте это так:

function click(element){
element.innerHTML="changed";
}

и HTML:

<button id="clicker" onclick="click(this)" >Click me</button>

Answer 2

Вы работаете click не знает об этом.Измените его на:

function click(elemenet){
    element.innerHTML="changed";
}

и

<button id="clicker" onclick="click(this)" >Click me</button>

Answer 3

Ваш вопрос, кажется, о значении this.В встроенном обработчике this будет представлять window.Вы можете установить значение this, используя .call(), поэтому оно дает желаемое значение.

Пример: http://jsfiddle.net/patrick_dw/5uJ54/

<button id="clicker" onclick="click.call(this)" >Click me</button>

Сейчас вваш click метод, this будет <button> элементом.

Причина в том, что ваш встроенный атрибут помещается в функцию, которая сама имеет контекст элемента.Но на самом деле он не вызывает вашу функцию из этого контекста.Делая click(), он в итоге выглядит следующим образом:

function onclick(event) { 
    click();
}

Ваша функция вызывается против какого-либо конкретного объекта, поэтому подразумевается window.Выполнив:

<button id="clicker" onclick="click.call( this )" >Click me</button>

... вы получите:

function onclick(event) { 
    click.call( this );
}

Предоставление нужного контекста.Вы также можете передать объект события:

<button id="clicker" onclick="click.call( this, event )" >Click me</button>

... так что вы получите:

function onclick(event) { 
    click.call( this, event );
}

Так что теперь в вашей функции click() вы получите event, как и следовало ожидать.

Кроме того, у вас могут возникнуть проблемы с использованием click в качестве имени функции.Я бы изменил это.

Answer 4

Посмотрите на http://www.quirksmode.org/js/this.html