I want to move the mouse over a Li, the result appears in the DIV

Question

I want to move the mouse over a Li, the result appears in the DIV

Navigation

#1 by (3 votes)

3

I want to hover the mouse over a li , the result will appear in div

Placing the mouse on Son 2: example: Parent 1 > Son 2

Or in Father 2: Father 2

<li ><a href="#estaEm">Pai 1</a>
  <ul>
    <li ><a href="#estaEm" >Filho 1</a></li>
    <li ><a href="#estaEm" >Filho 2</a></li>
  </ul>
</li>
<li ><a href="#estaEm">Pai 2</a>
  <ul>
    <li><a href="#estaEm" >Filho 1</a></li>
  </ul>
</li>
</div>
<div id="estaEm" value ="">resultado </div>

The jQuery I made does not work if only Father 2 appears:

$( "li" ).bind( "mouseover", function() {
    var result=''

    $( this ).find("a").each(function () {
        result += " > " + $( this ).text()
    });

    $("#estaEm").text(result)
});

javascript jquery

asked by anonymous 26.04.2017 / 17:02

1 answer

Simultaneous connection to PDO direct banks Insert the value of an attribute into a textBox

score 3 · Answer 1

Use $('li > a') as a selector in jQuery to pick up the child (s) from li and use this and get the text from the li that the mouse passed, simple.

See:

$('li > a').mouseover(function() {
  $('#estaEm').text($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><ul><li><ahref="#estaEm" >Filho 1</a></li>
   <li ><a href="#estaEm" >Filho 2</a></li>
</ul>
</li>
<li >
   <a href="#estaEm">Pai 2</a>
   <ul>
      <li><a href="#estaEm" >Filho 1</a></li>
   </ul>
</li>
</div>
<div id="estaEm" value ="">resultado </div>