Estoy trabajando con jquery, tengo 4 etiquetas de anclaje dentro de ul li y quiero que cada vez que el usuario busque algo, quiero saber el "enlace activo actual" para poder ejecutar mi consulta de acuerdo con la "etiqueta de anclaje" seleccionada. ¿Cómo puedo hacer esto? ? Aquí está mi código
<ul class="categorisbtn" id="categorisbtn" name="categorisbtn"> <li ><a href="javascript:void(0);" class="nav-link activelink" data-tagc="Company"><img src="images/inner-img/Company-Report.svg" alt="img" class="img-fluid"> Company Report</a></li> <li ><a href="javascript:void(0);" class="nav-link" data-tagc="StateR"><img src="images/inner-img/State-Report.svg" alt="img" class="img-fluid"> State Report</a></li> <li ><a href="javascript:void(0);" class="nav-link" data-tagc="BasinR"><img src="images/inner-img/Basin-Report.svg" alt="img" class="img-fluid"> Basin Report</a></li> <li ><a href="javascript:void(0);" class="nav-link" data-tagc="SectorR"><img src="images/inner-img/Sector-Report.svg" alt="img" class="img-fluid"> Sector Report</a></li> </ul>Y probé con el siguiente código
$(document).on("keyup", "#search_param", function () { var interest = $('ul#categorisbtn').find('li.activelink').data('interest'); alert(interest); });En la carga de la página, en la sección del encabezado de la página, puede agregar un método para establecer el enlace activo:
<script type="text/javascript"> $(document).ready(function(){ $('ul.categorisbtn li a').click(function(){ // remove all classes $('li a').removeClass('activelink'); // add class to the selected element $(this).addClass('activelink'); }); }); </script>Luego, en su método de búsqueda
$(document).on("keyup", "#search_param", function () { var interest = $('ul.categorisbtn').find('li>a.activelink').data('tagc'); alert(interest); });