9

Twitter Bootstrap を使用していますが、ボタンの状態を変更できないようです。

http://jsfiddle.net/YCst4/1/から js をコピーしていますが、応答がありません。jQueryがロードされていないようですが、ヘッダーにbootstrap.min.jsがロードされています。ページ上の他の JavaScript に問題はありません。

これは、私の Codeigniter ビューにあるものです。

<script>
$('#button').button();

$('#button').click(function() {
    $(this).button('loading');
});
</script>

<button class="btn" id="button" type="button" data-text-loading="Loading...">Press Me</button>

これを引き起こしている原因についてのアイデアはありますか? bootstrap-button.js は、Bootstrap に付属している bootstrap.min.js の一部ではありませんか?

http://twitter.github.com/bootstrap/javascript.html#buttons

編集:

ページのソースを表示すると、ヘッダー ビューに読み込まれた bootstrap.min.js が表示され、それをクリックしてソースを表示できるので、パスは正しいです。ただし、ボタン js コード<script src="http://site.dev/assets/admin/js/bootstrap.min.js"></script>は、実際のコンテンツ ビュー自体で繰り返す場合にのみ機能します。

私は、bootstrap.min.js の上の行に jQuery をロードし、ボタンと同じビュー内の jQuery 要素が完全に機能するようにしました。私は困惑しています。

4

5 に答える 5

14

bootstrap.min.js の後に jquery-ui-1.8.21.custom.min.js をロードしました。どうやら衝突が起きているようです。

于 2012-07-05T18:38:53.980 に答える
9

ページの準備ができた後に実行されるように、ドキュメントの準備ができた関数にコードを配置する必要があります。

$(document).ready(function(){
  $('#button').button();

  $('#button').click(function() {
    $(this).button('loading');
  });  
});

JS Fiddle はこれを自動的に行うように見えるため、そこで機能します。

于 2012-07-03T18:54:03.010 に答える
2

私のような JavaScript 初心者の場合:定義する前にjQuery もロードする必要があります。$('#button').click()

于 2013-06-25T14:31:13.493 に答える
2

ボタンが DOM の一部になる前に、クリックをボタンにバインドしようとしています。あなたのものをドキュメント準備機能に入れれば、大丈夫です。

于 2012-07-03T18:51:17.320 に答える
0

私は最近同じ問題を抱えていました。以下は、あなたを助けるかもしれないいくつかのことです:

  1. 必要な順序で js ファイルをロードしていますか。リストされた順序 (スクリプト タグとして) は、次のように正しい (依存関係に基づく) 順序でなければなりません。

    <script src="jquery.js"></script>
    <script src="bootstrap.js"></script>
    <script src="button_app.js."></script>
    
  2. ローカルまたはリモートの css/js ファイルを使用していますか? リモートのものを使用している場合。それらのいずれかが github を参照しているかどうかを確認します。それらが次のように見える場合:

    <script src="https://raw.github.com/twitter/bootstrap/master/js/bootstrap-alert.js"></script>
    

    それらは機能しません。Chrome は MIME タイプ エラーをスローします。

于 2013-06-05T13:37:27.453 に答える