JQuery - Seleccionar texto directamente en div

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 07/02/2019 17:05:26

Saludos programadores!

Tengo el siguiente código de ejemplo:

<div class="telefonos">

    <img><!-- icono de teléfono --></img>

123456789

</div>

No encuentro la manera de seleccionar el número de teléfono al estar escrito directamente en el div, sin etiquetas <b> o <p>.

Alguna forma? Gracias de antemano

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

Pos: 1

Val: 302

Seleccionar texto directamente en div

Publicado por xve (673 intervenciones) el 07/02/2019 20:21:49

utiliza text()...

$(".telefonos").text();

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 07/02/2019 20:36:31

Disculpen, con este código lo verán mejor:

<!DOCTYPE html>

<html>

  <head></head>

  <body>

    <div class="contenido">

      <a href="javascript:od('12345');">

        <b>Contactar</b>

      </a>

    </div>

    <div id="flotante">

      <iframe id="ifr">

        #document

          <html>

            <head></head>

            <body>

              <div class="div1">

                <div class="div2">

                  <div class="div3">

                    <div class="telefonos">

                      <img> (icono de telefono)

666777888

                    </div>

                  </div>

                </div>

              </div>

            </body>

          </html>

      </iframe>

    </div>

  </body>

</html>

Detallo un poco más:
Esto es para un trabajo de clase, me han dado una página que muestra una serie de tarjetas con la descripcion y foto de productos de ciertos proveedores para una empresa de alimentación.
Cada tarjeta tiene un enlace (en <div class="contenido">) que crea un iframe dentro del <div id="flotante">, el cual, mientras no se haga click en "contactar", permanece vacío.

Necesito poder seleccionar el texto plano del número de teléfono para posteriormente ocultar tarjetas de la pagina principal si coinciden con un numero concreto (o una lista de numeros contenidos en un array, que sería la meta de este proyecto).

El caso es que estoy atascado en la parte de seleccionar el texto del numero de telefono... he probado todo lo que se me ha ocurrido y lo que he averiguado en Google pero no hay resultado...

Luego esto va en un script que quiere el profesor con unas formas y estructura concretas que ya se como resolver, ahí no tengo problema.
Por lo pronto, estoy trabajando en Firefox con el TamperMonkey que para mí es más cómodo y hasta el momento tengo el siguiente código:

$('.div_a > .div_b > div_c > a > b').click(function(){

        var iframe = $("#flotante > #div_d > #ifr");

        var div_tel = iframe.contents().find(".telefonos");

        var tel = div_tel.text()

        console.log(tel)

});

Este script me retorna una salida en blanco, sin ningún valor... Alguna idea?

Muchísimas gracias por adelantado =D

Valora esta respuesta

Comentar

Pos: 1

Val: 302

Seleccionar texto directamente en div

Publicado por xve (673 intervenciones) el 08/02/2019 08:31:46

Dos cosas Roberto varias cosas...

una cosa, el código que deseas, esta dentro de un <iframe>, pero el contenido de un iframe, no lo puedes escribir dentro del mismo como tu lo has hecho... tiene que ser un archivo externo!!! si te fijas, en tu código no aparece nada de contenido en el recuadro del iframe.

no instancias la librería de jquery!!

Aquí tienes el código funcionando correctamente.

index.php

<!DOCTYPE html>

<html>

  <head></head>

  <body>

    <div class="contenido">

      <a href="javascript:od('12345');">

        <b>Contactar</b>

      </a>

    </div>

    <div id="flotante">

      <iframe id="ifr" src="x.html">

      </iframe>

    </div>

  </body>

</html>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>

<script>

$(document).ready(function(){

    console.log($("#ifr").contents().find(".telefonos").text());

});

</script>

x.html

<html>

<head></head>

<body>

  <div class="div1">

    <div class="div2">

      <div class="div3">

        <div class="telefonos">

          <img> (icono de telefono)

666777888

        </div>

      </div>

    </div>

  </div>

</body>

</html>

Valora esta respuesta

Comentar

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 08/02/2019 13:15:54

Buenas, primero que nada muchísimas gracias por contestar. En el post puse un código resumido omitiendo varias partes obvias del código, como son las que tú has comentado. El iframe está bien etiquetado y jquery importado. La parte de:

console.log($("#ifr").contents().find(".telefonos").text()

es la que no funciona, retorna una salida vacía. Hay alguna otra forma? Gracias

Valora esta respuesta

Comentar

Pos: 1

Val: 302

Seleccionar texto directamente en div

Publicado por xve (673 intervenciones) el 08/02/2019 18:49:08

Roberto, de la forma que lo he puesto a mi me ha funcionado!!

Si creas los dos archivos y lo pruebas no te funciona?

Valora esta respuesta

Comentar

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 07/02/2019 20:37:49

Buenas xve, respondiste mientras escribía el detalle asique... como comenté, ya he intentado .text() pero no sé si lo estoy usando mal (probablemente xD) o que ocurre, el caso es que me retorna un log vacío =(

Valora esta respuesta

Comentar

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 08/02/2019 15:04:47

Actualizo:

Sospecho que no me está funcionando correctamente porque la función .text() está recogiendo texto de un elemento que aún no está cargado... puse un alert después del console.log para comprobarlo y efectivamente, salta primero el alert y luego carga el iframe.

Entonces... no me está pillando el texto porque el iframe se carga después de que la función busque el texto... Cómo puedo solucionar esto?

Gracias

Valora esta respuesta

Comentar

Pos: 38

Val: 11

Seleccionar texto directamente en div

Publicado por Roberto (6 intervenciones) el 08/02/2019 16:13:51

Lo he logrado!

El problema estaba en el TamperMonkey, le tenia asignado en la configuración que ejecutara el script en la mainpage, no en el iframe. Al ponerle el iframe la funcion .text() hace su trabajo correctamente.

Siento tanto lío, al final fue un fallo que nisiquiera tiene que ver con jQuery... Si algún moderador ve este hilo por favor que lo cierre pues ya está resuelto =D Gracias a todos por su tiempo y especialmente a los que contestaron =D A programar!
Saludos

Valora esta respuesta

Comentar

Cargar datos dinamcos en selects dinamicos con jquery y ajax

no logro dividir satisfactoriamente variable con split