14

にあるhtmlページをレンダリングする必要がありますtemplates/home.html

私は次のようにボタンを持っていますindex.html： 

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

私がしたいのは私がクリックするときだけですBrowse、それは私を連れて行きますhome.html

私は次のように書き込もうとしましjQueryた： 

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

ただし、ロードでは現在のページのどこかにデータを配置する必要があるため、これは機能しません

home.htmlオンボタンクリックにアクセスするにはどうすればよいですか？

4

4 に答える 4

47

私が知る限り、TwitterBootstrapを使用しています。Buttonsのドキュメントは、あなたのポイントに対応しています。

デフォルトのボタン

ボタンスタイルは、.btnクラスが適用されているすべてのものに適用できます。ただし、通常は、これらを要素にのみ適用<a>し<button>て、最適なレンダリングを実現する必要があります。

これはあなたが望むものです：

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

最悪のシナリオでは、この方法ではボタンのレンダリングは見栄えが悪くなりますが、リンクは機能します。JSを使用すると、最悪のシナリオではリンクが役に立たなくなります。

于 2012-09-01T20:08:47.850 に答える
10

使用：ボタンタグにonclick="window.location='HTMLファイルをここに挿入'"

以前に準備したもの： <button class="btn" style="text-align:inherit" onclick="window.location='./Learn/'">&laquo; About HerdMASTER 4</button>

同じフォルダ内の別のディレクトリから学ぶディレクトリに行きたかった

含まれているブートストラップクラスを使用するより洗練されたソリューションです。つまり、ページにコードをハックする必要はありません。グーグル検索で見つけるのではなく、上記のコードからこれを理解したので、ブートストラップのさまざまなクラスに関する機能ドキュメントがもう少しあればいいのにと思います。

于 2014-10-03T02:33:14.110 に答える
7

これを使って：

$(function(){
    $('#browse_app').click(function(){
        window.location='templates/home.html'
    });
});
于 2012-09-01T20:04:28.630 に答える
0

onclick = "window.open（'YourPage.aspx'、'_self'）;"を使用します

例えば：

<button type="submit" onclick="window.open('YourPage.aspx','_self');" class="btn btn-default">Your Page</button>
于 2018-01-30T11:52:55.907 に答える