блок изображения мой интерактивный div

Question

У меня есть указатель мыши над функцией в javascript и кликабельный div, дело в том, что когда я нажимаю на изображение, ничего не происходит, но за пределами изображения все работает отлично.

   <div id="1" onclick="SendRating(this.id);" onmouseover="rateStar(this.id)" ><img src="star.jpg"></div>

и мойНаведите курсор мыши на функцию.

function rateStar(rating){
    var i = 1;
    var ratings = '';
    for (i==1; i<=5; i++){
        if (i<=rating){
            document.getElementById(i).innerHTML = '<img src="star1.gif">';
        }
        else{
            document.getElementById(i).innerHTML = '<img src="star.jpg">';
        }
    }
}

спасибо

Answer 1

идентификаторы не могут начинаться с цифр.Создайте свой код:

<div id="rating_1" score='1' onclick="SendRating(this.getAttribute('score'));" onmouseover="rateStar(this.id)" ><img src="star.jpg"></div>

и измените свой javascript на

function rateStar(rating){
    var i = 1;
    var ratings = '';
    for (i==1; i<=5; i++){
        if (i<=rating){
            document.getElementById('rating_'+i).innerHTML = '<img src="star1.gif">';
        }
        else{
            document.getElementById('rating_'+i).innerHTML = '<img src="star.jpg">';
        }
    }
}

Это может не решить вашу проблему, но вам необходимо это сделать в любом случае.Также подумайте о перемещении события onclick на само изображение:

<div><img src="star.jpg" score='1' id="rating_1" onclick="SendRating(this.getAttribute('score'));" ></div>

и изменении js на:

 function rateStar(rating){
        var i = 1;
        var ratings = '';
        for (i==1; i<=5; i++){
            if (i<=rating){
                document.getElementById('rating_'+i).src= 'star1.gif';
            }
            else{
                document.getElementById('rating_'+i).src= 'star.jpg';
            }
        }
    }

Таким образом, вы просто меняете источник изображения