ajax - jquery on hover does not work on bootstrap tree view -


my problem not expected on li jquery onhover trigger anonymous function . html structure

   $(document).ready(function () {          $.ajax({              url: "fetch.php",              method: "post",              datatype: "json",              success: function (data) {                  $('#treeview').treeview({data: data});              }          });        });      $("#treeview").on('click','.list-group', function () {  // 		var t = $(this).find('li');          alert('here');          console.log($(this));
<div class="container" style="width:900px;">      <div id="treeview">      </div>  </div>

but onhover of li jquery function not triggering after ajax respond html structure become this

<div id="treeview" class="treeview">  	<ul class="list-group">  		<li class="list-group-item node-treeview node-selected" data-nodeid="0" style="color:#ffffff;background-color:#428bca;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>usa</li>  		<li class="list-group-item node-treeview" data-nodeid="13" style="color:undefined;background-color:undefined;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>canada</li>  		<li class="list-group-item node-treeview" data-nodeid="20" style="color:undefined;background-color:undefined;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>australia</li>  	</ul>  </div>

but jquery not triggering onhover function

please try this

                 $("#treeview").on('mouseover','.list-group-item', function () {                          console.log($(this).html());   });          
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="container" style="width:900px;">             <div id="treeview" class="treeview">      	<ul class="list-group">      		<li class="list-group-item node-treeview node-selected" data-nodeid="0" style="color:#ffffff;background-color:#428bca;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>usa</li>      		<li class="list-group-item node-treeview" data-nodeid="13" style="color:undefined;background-color:undefined;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>canada</li>      		<li class="list-group-item node-treeview" data-nodeid="20" style="color:undefined;background-color:undefined;"><span class="icon expand-icon glyphicon glyphicon-plus"></span><span class="icon node-icon"></span>australia</li>      	</ul>      </div>          </div>


Comments

Popular posts from this blog

html - How to set bootstrap input responsive width? -

javascript - Highchart x and y axes data from json -

javascript - Get js console.log as python variable in QWebView pyqt -