как вызвать событие onmouseover для элемента в javascript?

Как указано в заголовке, как запустить событие onmouseover для элемента в javascript? пожалуйста, обратитесь к фрагменту кода. Могу ли я вместо наведения курсора на большой прямоугольник щелкнуть маленький черный прямоугольник и выполнить событие onmouseover? Цель НЕ сделать коробку синей, а ЗАПУСТИТЬ событие onmouseover. И еще мне нужно, чтобы это было сделано только с помощью JavaScript, без JQuery, пожалуйста.

 

function showBlue() {
        document.getElementById('xyz').style.background = "#425dff"; 
}
function showRed() {
        document.getElementById('xyz').style.background = "#e2e2e2";
}
#abc{width: 50px; height: 50px; background: #000000; color:#ffffff; cursor: pointer;}
#xyz{width: 200px; height: 200px; background: #e2e2e2;}
<div id="abc"><a>click me</a></div>

</br>

<div id="xyz" onmouseover="showBlue()" onmouseout="showGrey()"></div>

 

Я пробовал это, но у меня не получилось :(

<script>
    document.getElementById('abc').addEventListener("click", triggerFunction);

    function triggerFunction() {
        document.getElementById('xyz').mouseover();
    }
</script>

Мне нужно, чтобы это было чистое решение javascript, если возможно   —  person Dylan Daicy Siao    schedule 13.03.2015

Хотел бы я проголосовать против этого комментария Теему :(   —  person Dylan Daicy Siao    schedule 13.03.2015

См. также:  Как предотвратить масштабирование CTRL и колеса прокрутки / трекпада во Flutter Web?
Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 2
  1. Dylan Daicy Siao

    Это должно работать:

    function showBlue() {
            document.getElementById('xyz').style.background = "#425dff"; 
    }
    function showGrey() {
            document.getElementById('xyz').style.background = "#e2e2e2";
    }
    function triggerMouseOver() {
        document.getElementById('xyz').onmouseover();
    }
    #abc{width: 50px; height: 50px; background: #000000; color:#ffffff; cursor: pointer;}
    #xyz{width: 200px; height: 200px; background: #e2e2e2;}
    <div id="abc" onclick="triggerMouseOver()"><a>click me</a></div>
    
    </br>
    
    <div id="xyz" onmouseover="showBlue()" onmouseout="showGrey()"></div>

    Вы также можете просто сделать это:

    <div id="abc" onclick="document.getElementById('xyz').onmouseover()"><a>click me</a></div>
    

    Ваш элемент использует showGrey, но вы объявили только showBlue и showRed. Думаю, функцию showRed нужно переименовать? person Dylan Daicy Siao; 13.03.2015

    Это будет работать только со встроенными обработчиками … person Dylan Daicy Siao; 13.03.2015

    Да, у его кода было неправильное имя, но я забыл его исправить. Я обновлю свой код ответа. person Dylan Daicy Siao; 13.03.2015

  2. Dylan Daicy Siao

    Это должно быть onmouseover() вместо mouseover()

    document.getElementById('xyz').onmouseover();
    
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: