JQuery - mostrar paginas web dentro de la misma pagina usando div y iframe

 
Vista:
sin imagen de perfil

mostrar paginas web dentro de la misma pagina usando div y iframe

Publicado por Gabriela (2 intervenciones) el 23/04/2018 08:10:48
Hola Buenas noches esque tengo incoveniente el cual es: desde mi menu bar no se muestra en el div y iframe el target "ver" las paginas php que necesito mostrar, Ya que utilice un jQuery que permite obvervar las opciones al darle click, lo que pasa esque cada vez que le doy click me abre una ventana nueva y eso no es lo que deseo ssi no que las abra como antes las abria sin el jquery
Codigo Html
f1
Codigo jquery

f2

Gracias de antemano
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 302
Oro
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

mostrar paginas web dentro de la misma pagina usando div y iframe

Publicado por xve (673 intervenciones) el 23/04/2018 13:33:10
Hola Gabriela, por lo que veo, tiene que reemplazar el contenido del div con el class "contenido" (eliminando el iframe) y poniendo lo que le viene del php... en ningún momento se ver que indiques que se abra en una nueva pestaña!!!
Que devuelve el archivo 03-jquery-load05.php?

Puedes pegar el código para poder probarlo?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

mostrar paginas web dentro de la misma pagina usando div y iframe

Publicado por Gabriela (2 intervenciones) el 23/04/2018 18:37:46
Jquery
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
$(document).ready(function(){
      $('.menu li:has(ul)').click(function(e){
    e.preventDefault();
  if ($(this).hasClass('activado')){
      $(this).removeClass('activado');
      $(this).children('ul').slideUp();
    } else {
      $('.menu li ul').slideUp();
      $('.menu li').removeClass('activado');
      $(this).addClass('activado');
      $(this).children('ul').slideDown();
    }
  });
      $('.btn-menu').click(function(){
      $('.contenedor-menu .menu').slideToggle();
  });
  $(window).resize(function(){
  if ($(document).width() > 450){
      $('.contenedor-menu .menu').css({'display' : 'block'});
    }
  if ($(document).width() < 450){
      $('.contenedor-menu .menu').css({'display' : 'none'});
      $('.menu lu ul').slideUp();
      $('.menu li').removeClass('activado');
     }
});
	$('.menu li ul li a').click(function(){
   $('.contenido').load('/demos/2013/03-jquery-load05.php');
   //window.location.href= $(this).attr("href");
  });
});

Html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!Doctype html>
<html lang="es">
    <head>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <title>Arbitrium</title>
        <meta charset="UTF-8">
        <meta name="description" content="Arbitrium html y css">
        <meta name="keywords" content="html y css3">
        <link rel="stylesheet" href="css/estilosMenus.css" type="text/css">
 
        <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
        <link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
        <link rel="shortcut icon" href="imagenes/favicon.png">
 
 
</head>
    <body >
    <div class="contenedor-menu">
             <a href="#" class="btn-menu">Menu<i class="icono fas fa-bars"></i></a>
 
        <ul class="menu">
            <li><a href="http://localhost/arbitrium/Proyecto/programaA.php" target=ver><i class="icono izquierda fas fa-cubes"></i>Programas</a></li>
            <li><a href="#"><i class="icono izquierda fas fa-cog"></i>Operativos<i class=" icono derecha fas fa-chevron-down"></i></a>
            <ul>
             <li><a href="http://localhost/arbitrium/Proyecto/programaA.php" target=ver>Programa</a></li>
             <li><a href="http://localhost/arbitrium/Proyecto/fichaA.php" target=ver>Fichas</a></li>
             <li><a href="http://localhost/arbitrium/Proyecto/alumnop.php" target=ver>Alumno</a></li>
 
             <li><a href="#">Candidato</a></li>
             <li><a href="#">Voto</a></li>
                </ul>
            </li>
            <li><a href="http://localhost/arbitrium/Proyecto/usuarios.php" target=ver><i class="icono izquierda fas fa-user-circle"></i>Administrador</a></li>
            <li><a href="cerrarsesione.php"><i class="icono izquierda fas fa-sign-out-alt"></i>Salir</a></li>
        </ul>
     </div>
 
 
    <div class="contenido abrir" style="background-image: url(imagenes/fondo3.jpg); width:100%; height:100%">
        <iframe name=ver height="550" width="900" boder=1 frameborder="0"></iframe>
     </div>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script src="js/main.js"></script>
    </body>
</html>
este es el codigo, Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de santi
Val: 162
Plata
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

mostrar paginas web dentro de la misma pagina usando div y iframe

Publicado por santi (55 intervenciones) el 27/04/2018 01:33:51
Hola,

lo que pasa es que si añades el atributo "target" el documento lo interpreta de otra forma y es que un target es para mostrar el contenido del "href" en un sitio u otro... Aquí la explicación -> https://www.w3schools.com/tags/att_a_target.asp

Los más comunes son target="self" (misma página por defecto) o target="_blank" (una página nueva).

Si quitas esa opción y quieres que haga algo al hacer click con jQuery:

1
<a href="javascript:void(0)" class="mi-link">...</a><!-- void(0) es una ruta vacía que no lleva a ningún sitio -->

jQuery:

1
2
3
$('.mi-link').click(function(){
      //la función
});

O puedes crear una función con jQuery y llamarla desde html:

1
2
3
function mi_click(){
    //la función
}

html:

1
<a href="javascript:void(0)" onClick="mi_click();">...</a>

Prueba a ver ;)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar