1. ホーム
  2. javascript

[解決済み] Twitter Bootstrapのドロップダウンのイベントハンドラ?

2023-04-13 14:01:35

質問

私は Twitter Bootstrapのドロップダウン・ボタン :

    <div class="btn-group">
      <button class="btn dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
      <ul class="dropdown-menu">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
      </ul>
    </div><!-- /btn-group -->

ユーザーがボタンの値を 'Another action' に変更したとき、単に # に移動するのではなく、実際にはカスタムな方法でアクションを処理したいと思います。

しかし、どのイベントハンドラも をドロップダウンプラグインの が見当たりません。

Bootstrap のドロップダウンボタンを使用して、ユーザーのアクションを処理することは可能でしょうか?この例では、アクションのリストを提供していますが、これは紛らわしいことです。

どのように解決するのですか?

Twitter ブートストラップは基本的な機能を提供することを目的としており、何かを行う基本的な javascript プラグインのみを提供します。 画面上 . 追加のコンテンツや機能は、あなた自身で行う必要があります。

<div class="btn-group">
  <button class="btn dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
  <ul class="dropdown-menu">
    <li><a href="#" id="action-1">Action</a></li>
    <li><a href="#" id="action-2">Another action</a></li>
    <li><a href="#" id="action-3">Something else here</a></li>
  </ul>
</div><!-- /btn-group -->

で、次にjQueryで

jQuery("#action-1").click(function(e){
//do something
e.preventDefault();
});