javascript - Execute mouseover() from JS without change position of mouse - Stack Overflow

admin管理员组

文章数量:1395274

I have on div, after mouseover it change here content, how I can to execute mouseover without mouse, it is possible?

my div before mouse over:

<div id="divId" class="some_css_class" style="visibility: visible;">
<div style="visibility: hidden;">
      <p>Test</p>
   </div>
</div>

my div after mouseover:

<div id="divId" class="some_css_class" style="visibility: visible;">
    <div style="visibility: visible;">
          <p>Test</p>
       </div>
    </div>

I have on div, after mouseover it change here content, how I can to execute mouseover without mouse, it is possible?

my div before mouse over:

<div id="divId" class="some_css_class" style="visibility: visible;">
<div style="visibility: hidden;">
      <p>Test</p>
   </div>
</div>

my div after mouseover:

<div id="divId" class="some_css_class" style="visibility: visible;">
    <div style="visibility: visible;">
          <p>Test</p>
       </div>
    </div>

• javascript
• jquery
• html
• css

Share Improve this question Follow asked Oct 10, 2014 at 9:42 AlexAlex 9,7403030 gold badges107107 silver badges166166 bronze badges

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 7

You can simulate events using trigger function, but before you trigger the event you have to specify its function

    $('#divId').on('mouseover', function(){
        $(this).find('>:first-child').css('visibility','visible');
    });
    // Line below triggers the event programmatically on load 
    $('#divId').trigger('mouseover');

Look at this fiddle for more reference http://jsfiddle/Aerious/nLf90cyt/

You can use jQuery's mouseover() but I think simulating events is not the good way to go if you need more than just a css effect (like programmaticaly hide a div).

It would be cleaner to have a function that toggles the div state and call it whenever you want to change the state of the div.

You can use .mouseover():

$('#divId').mouseover()

You can use .trigger()

$('#divId').trigger('mouseover');

You should try to use "native" Javascript without JQuery. You could try this:

var event = new Event('mouseover');
document.querySelector('#divId').dispatchEvent(event);

Give me feedback if it works as you wanted it to work ;)

You can trigger mouseover event using:

document.getElementById('divId').onmouseover();

Also you need to bind callback function for mouseover event on your div with id='divId' and change div visibility in the callback.

Hope this helps

本文标签： javascriptExecute mouseover() from JS without change position of mouseStack Overflow