2012-09-01 15 views
13

que tienen que representar una página HTML que residen en templates/home.html¿Cómo navego a otra página al hacer clic en el botón con Twitter Bootstrap?

tengo un botón en index.html como:

<div id="browse_app"> 
    <button class="btn btn-large btn-info" type="button">Browse</button> 
</div> 

Todo lo que quiero hacer es cuando hago clic en Browse, que toma me home.html

traté de escribir jQuery como:

// onClick on 'Browse' load the internal page 
$(function(){ 
    $('#browse_app').click(function(){ 
     $.load('templates/home.html'); 
    }); 
}); 

Pero esto no funciona ya que la carga tiene que poner los datos en algún lugar de la página actual

¿Cómo llego a la home.html en el botón haga clic en?

+4

¿Por qué no usar '' Browse? Si está utilizando Bootstrap, puede darle un estilo similar al de un botón, utilizando las mismas clases de CSS. –

+0

Estás usando Twitter Bootstrap, ¿verdad? – Alexander

+0

correcto !!Estoy usando Bootstrap – daydreamer

Respuesta

41

Por lo que yo puedo decir que está utilizando Twitter Bootstrap. La documentación para Buttons se dirige a su punto:

botones predeterminados

estilos botón se puede aplicar a cualquier cosa con la clase .btn aplicado. Sin embargo, normalmente querrá aplicarlos solo a los elementos <a> y <button> para obtener la mejor representación.

Esto es lo que quiere:

<div id="browse_app"> 
    <a class="btn btn-large btn-info" href="templates/home.html">Browse</a> 
</div> 

En el peor de los casos, de esta manera la prestación del botón no se ven bien, pero el enlace funcionará. Usando JS, su peor escenario hará que el enlace sea inútil.

6

Utilice esta:

$(function(){ 
    $('#browse_app').click(function(){ 
     window.location='templates/home.html' 
    }); 
}); 
8

Uso: onclick="window.location=' Insertar archivo HTML AQUÍ '" en su etiqueta del botón

Uno me preparó anteriormente: <button class="btn" style="text-align:inherit" onclick="window.location='./Learn/'">&laquo; About HerdMASTER 4</button>

que quería ir al directorio Aprender de otro directorio en la misma carpeta

Es una solución más elegante que utiliza la clase de arranque que se incluye, lo que significa que no tiene que hackear el código en su página. Desearía que hubiera un poco más de documentación de funcionalidad sobre las diversas clases para bootstrap, ya que lo descubrí en el código anterior en lugar de encontrarlo en una búsqueda en Google.

0

Use onclick = "window.open ('YourPage.aspx', '_ self');"

Por ejemplo:

<button type="submit" onclick="window.open('YourPage.aspx','_self');" class="btn btn-default">Your Page</button> 
Cuestiones relacionadas