0

hola gente les comento estoy trabajando para poder hacer una web que tiene WordPress y elementor como constructores (si se que tiene muchas cosas buenas pero también tiene estos problemas).

lo que quería saber es que use una de los widgets de este programa es que el "Conmutador" donde me da la posibilidad de hacer una lista que tenga un texto abajo el cual con el hipervínculo del titulo este texto se hace visible o no.

Con eso dicho el problema es que me pidieron para ver si era posible cambiar el titulo que activa el evento que cuando esta inactivo diga "leer mas" y cuando esta activo diga "leer menos"

lo que quería saber era una de dos: Primero si alguien tiene idea de como alterar el evento de este widgets, porque con eso ya puedo hacer mis propias pruebas para ver si lo que tengo pensado funciona o no?

La Segunda es que si no saben como cambiar el evento quería saber si se pueden poner 2 eventos en simultaneo que los llame un mismo button o hipervínculo.

dejo el código ya que tendría que poner el JS dentro de una etiqueta <script> para solucionar este tema. Desde ya muchas gracias saludos.

    <div onload="cambioDeTexto()" id="elementor-tab-title-1431" class="elementor-tab-title" data-tab="1" role="tab" aria-controls="elementor-tab-content-1431" aria-expanded="false">
        <span class="elementor-toggle-icon elementor-toggle-icon-left" aria-hidden="true">
            <span class="elementor-toggle-icon-closed"><i class="fas fa-ellipsis-h"></i></span>
            <span class="elementor-toggle-icon-opened"><i class="elementor-toggle-icon-opened fas fa-ellipsis-v"></i></span>
        </span>
        <a href="" class="elementor-toggle-title">Leer mas</a>
    </div>
3
  • 1
    Puede haber distintos eventos para cada elemento pero solo una da cada clase, uno de click, uno de scroll, un keyup, etc, te recomiendo que veas a cerca de toogle
    – Christian
    Commented el 3 may. 2021 a las 13:55
  • okey osea dos onclick es imposible no? Commented el 3 may. 2021 a las 15:28
  • Si, salvo que cada onclick lo hagas en un elemento diferente, no se acepta más de un evento del mismo tipo por elemento
    – Christian
    Commented el 3 may. 2021 a las 16:02

1 respuesta 1

0

document.querySelector(".elementor-toggle-title").addEventListener("click", (event) => {
 event.target.parentElement.querySelector(":scope > .elementor-toggle-icon").toggleAttribute("open");
});
.elementor-toggle-icon[open] ~ .elementor-toggle-title {
 font-size: 0px;
}

.elementor-toggle-icon[open] ~ .elementor-toggle-title::before {
 content: "Leer menos"; font-size: initial;
}

.elementor-toggle-icon[open] > .elementor-toggle-icon-closed {
 display: none;
}

.elementor-toggle-icon:not([open]) > .elementor-toggle-icon-opened {
 display:none;
}
<div onload="cambioDeTexto()" id="elementor-tab-title-1431" class="elementor-tab-title" data-tab="1" role="tab" aria-controls="elementor-tab-content-1431" aria-expanded="false">
 <span class="elementor-toggle-icon elementor-toggle-icon-left" aria-hidden="true">
  <span class="elementor-toggle-icon-closed"><i class="fas fa-ellipsis-h"></i>Cerrado</span>
  <span class="elementor-toggle-icon-opened"><i class="elementor-toggle-icon-opened fas fa-ellipsis-v"></i>Abierto</span>
 </span><br>
 <a href="javascript:return;" class="elementor-toggle-title">Leer mas</a>
</div>

Como ves lo puedes hacer con un solo controlador de eventos. A diferencia de lo que te han dicho, si los creas haciendo uso de .addEventListener puedes asociar mas de un evento del mismo tipo a un mismo elemento pero en este caso no es necesario.

{
 let el = document.querySelector("a#test");
 el.addEventListener("click", (event) => {
  alert("Mi ID es '" + event.target.id + "'.");
 });
 el.addEventListener("click", (event) => {
  alert("Mi contenido es '" + event.target.innerHTML + "'.");
 });
}
<a id="test" href="javascript:return;">testar</a>

Aqui la prueba con dos controladores de evento click a un mismo elemento.

Tu duda es para un caso muy particular en el que habria que revisar un evento que supuestamente ya existe.

Con la informacion que has ofrecido yo mas no puedo hacer. Si nos das el javascript que esta haciendo el cambio podria decirte que hacer.

En mi ejemplo el marcado se realiza por parte de un atributo de nombre open puede ser que lo este haciendo con algun atributo o con alguna clase (esto se contiene en el atributo class). En cualquiera de los dos casos seria necesario saber no solo el tipo de dato como ya dije, sino tambien su nombre.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.