Tengo 2 funciones haciendo lo mismo, solo apuntando a dos clases diferentes en mi página. ¿Hay alguna manera de consolidar estos dos en una sola función?
$(document).on("click", ".class1", function(event) { const $this = $(this); if ($this.find($(event.target).closest("a")[0]).length === 0) { event.preventDefault(); $this.find("a")[0].click(); } }); $(document).on("click", ".class2", function(event) { const $this = $(this); if ($this.find($(event.target).closest("a")[0]).length === 0) { event.preventDefault(); $this.find("a")[0].click(); } });Tengo muchas tarjetas en la página que tienen el nombre de clase 1 y clase 2, sé que puedo darles a cada una una clase adicional, algo como .se puede hacer clic y agregarlo a cada tarjeta en la página, pero me preguntaba si hay una forma más fácil. forma de tener esta función dirigida a 2 clases a la vez.
Puedes juntarlos así
para activar el enlace ancla en el primer elemento <a> coincidente
$(document).on("click", ".class1, .class2", function(event) { if ($(this).find($(event.target).closest("a")[0]).length === 0) { event.preventDefault(); $(this).find("a")[0].click(); } // $(event.target).find("a").eq(0)[0]?.click(); }); .padd { padding: 30px; background: #f0f0f0; margin-bottom: 20px; } #gohere{ margin-top:500px; height:300px; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class='class1 padd'> <a href='#gohere' onclick='console.log("CLICKED1")'>the link</a><br> <a href='#' onclick='console.log("this should not fire....")'>a second link</a> </div> <div class='class2 padd'> <a href='#' onclick='console.log("CLICKED2")'>the link</a> </div> <div class='class2 padd'> no link here </div> <div id='gohere'>Anchor link text....</div>