Не работает скрипт :help:
(function(){
$(document).on('mouseover','count', function(counter=0, element){
counter++;
element.innerHTML='Вы навели курсор на этот див ' + counter + ' раз!';
});
}());
|
element есть у вас?
|
в методе on вторым параметром может идти селектор.
возможно, надо написать '#count' или '.count' - в зависимости от того, id это или класс |
<style>
div{
width: 100px;
height: 100px;
border: 1px solid gray;
}
</style>
<div></div>
<div></div>
<div></div>
<script>
document.querySelectorAll('div').forEach(el=> el.onmouseover =e=> ++el.textContent);
</script>
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
width: 100px;
height: 100px;
border: 1px solid gray;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<script>
document.querySelectorAll('div').forEach(el=> el.onmouseover =e=> el.textContent = 'Вы навели курсор на этот див ' + (+el.textContent.replace(/\D/g,'')+1) + ' раз!');
</script>
</body>
</html>
|
<style>
div{
width: 100px;
height: 100px;
border: 1px solid gray;
}
</style>
<div id='count'></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
(function(){
var counter = 0;
$(document).on('mouseover','#count', function(){
counter++;
this.innerHTML='Вы навели курсор на этот див ' + counter + ' раз!';
});
}());
</script>
Или так
<style>
div{
width: 100px;
height: 100px;
border: 1px solid gray;
}
</style>
<div id='count'></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
(function(){
$(document).on('mouseover','#count', { counter:0 }, function(e){
e.data.counter++;
this.innerHTML='Вы навели курсор на этот див ' + e.data.counter + ' раз!';
});
}());
</script>
|
А в первом случае обязательно выносить переменную из функции?
|
Цитата:
Второй вариант как раз демонстрирует другой способ задания начального значения. |
| Часовой пояс GMT +3, время: 14:32. |