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
Post a Comment