Форум

OlegALL · #1 (**permalink**) 18.06.2014, 10:56

Привет.

Такая проблема.

this.width, инициализированный вызовом конструктора, при непосредственном вызове функции showNextPicture равен 130 - как надо, а если вызвать эту функцию через onclick - то undefuned. Почему?

код:

function Carousel(width, count){
		this.width = width;
		this.count = count;
	}

Carousel.prototype.init = function(){
// код
}


Carousel.prototype.showNextPicture = function(){
console.log(this.width); // 130 - если вызвать прямо, undefined - если по щелчку мыши
}

var carousel = new Carousel(130, 5);	
carousel.init();  
//carousel.showNextPicture();

// Обработчики событий
document.getElementById('next').addEventListener("click", carousel.showNextPicture, false);
document.getElementById('prev').addEventListener("click", carousel.showPreviousPicture, false);

рони · #2 (**permalink**) 18.06.2014, 11:15

OlegALL,
а если так

document.getElementById('next').addEventListener("click", function(){
carousel.showNextPicture()
} , false);

Aetae · #3 (**permalink**) 18.06.2014, 11:21

Потому что this в обработчике события ссылается на элемент на котором оно висит.

OlegALL · #4 (**permalink**) 18.06.2014, 15:01

рони, не помогло, симптом тот же

OlegALL · #5 (**permalink**) 18.06.2014, 15:03

Сообщение от Aetae

Потому что this в обработчике события ссылается на элемент на котором оно висит.

Я не понял, можно разъяснить? И как сделать как мне надо?

рони · #6 (**permalink**) 18.06.2014, 15:17

Сообщение от OlegALL

рони, не помогло, симптом тот же

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
</head>

<body>   <p id='next'>жмак сюды</p>
   <script>
         function Carousel(width, count){
      this.width = width;
		this.count = count;


	}

Carousel.prototype.init = function(){
// код
}


Carousel.prototype.showNextPicture = function(){
alert(this.width); // 130 - если вызвать прямо, undefined - если по щелчку мыши
}

var carousel = new Carousel(130, 5);
carousel.init();
//carousel.showNextPicture();

// Обработчики событий
document.getElementById('next').addEventListener("click", function(){
carousel.showNextPicture()
} , false);
//document.getElementById('prev').addEventListener("click", carousel.showPreviousPicture, false);

   </script>
</body>

</html>

OlegALL · #7 (**permalink**) 18.06.2014, 21:20

Сообщение от рони

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
</head>

<body>   <p id='next'>жмак сюды</p>
   <script>
         function Carousel(width, count){
      this.width = width;
		this.count = count;


	}

Carousel.prototype.init = function(){
// код
}


Carousel.prototype.showNextPicture = function(){
alert(this.width); // 130 - если вызвать прямо, undefined - если по щелчку мыши
}

var carousel = new Carousel(130, 5);
carousel.init();
//carousel.showNextPicture();

// Обработчики событий
document.getElementById('next').addEventListener("click", function(){
carousel.showNextPicture()
} , false);
//document.getElementById('prev').addEventListener("click", carousel.showPreviousPicture, false);

   </script>
</body>

</html>

Спасибо! Ваша строка работала, сорри, что-то не углядел

Форум

Справочник

Discord чат

Курсы javascript