haga clic en el menú desplegable trabajando en una página pero no en otra, aunque es el mismo componente que cargan estas páginas y el mismo archivo javaScript
Aquí está el componente
<li class="nav-item dropdown"> <a class="nav-link dropdown-toggle active" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false">Please Select A Fabric Range</a> <ul class="dropdown-menu"> {% for fabricRange in fabricRanges %} <li> <a class="nav-link dropdown-item" id="tab-{{ fabricRange.id }}" data-bs-toggle="tab" data-bs-target="#tabpane{{fabricRange.id}}" type="button" role="tab" aria-controls="tabpane-{{fabricRange.id}}" aria-selected="true">{{fabricRange.title}}</a> </li> {% endfor %} </ul> </li>y js
$(".dropdown-menu").on("click", "a.nav-link.dropdown-item", function() { console.log("clicked") $(this).parents(".nav-item.dropdown").find("a.dropdown-toggle").html($(this).html()) })Lo he usado en tres páginas, dos obras, una no. el console.log() también funciona bien en las dos páginas pero no responde en la tercera. Por favor ayuda
Primero debe verificar si la clase de menú desplegable existe o no. En caso de que exista, debe verificar si tiene una clase de elemento desplegable de enlace de navegación o no. Entonces, para esto, debe verificar el HTML de ese elemento. Por favor, siga la siguiente pieza de código para este propósito.
$(document).ready(function(){ var count = 0; if ($(".dropdown-menu").length > 0) { $(".dropdown-menu").each(function(index, item) { count = count + 1; if(count !== 0){ console.log($(item).html()); console.log(item.innerHTML); } }); } //alert("count-->"+count); console.log(count);})Después de la verificación, si tiene todo lo mencionado en el punto 1 anterior y el clic aún no funciona, debe verificar si JQUERY se está cargando correctamente y en la misma jerarquía que en otras 2 páginas.