18

Bootstrap 3 を使用してモーダル イベントをまったく動作させることができないようです。モーダルを閉じたときにアクションを実行したいのですが、何も起こりません。

これが私の取り除かれた HTML です。

<button type="button" data-toggle="modal" data-target="#imageUpload">Launch modal</button>

<div class="modal fade" id="imageUpload" tabindex="-1">
<div class="modal-dialog">
    <div class="modal-content">
        Upload form here
    </div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->

そして私のJS：

$(function(){
    $('#imageUpload').modal({
        show: false
    });

    $('#imageUpload').on('hidden', function () {
        window.alert('hidden event fired!');
    });
});

ここに JSfiddle をまとめました - http://jsfiddle.net/EcnC3/1/

Bootstrap 3 でモーダル イベントが機能しないという報告は他に見当たりません。あなたが提供できる助けをありがとう

4

5 に答える 5

6

fadeモーダル要素のクラスを削除すると修正されます。

https://github.com/twbs/bootstrap/issues/11793

@Fintの回答を参照してください

于 2015-04-20T09:05:45.513 に答える
0

正しいとマークされた答えはそれだけですが、「私がやったことのばかげたこと」の膨大なリストへの追加です-また、どのDOM要素をターゲットにするか注意してください。外側のモーダル Div である必要があります。

たとえば、RequireJS と Knockout-amd-helper などのテンプレート マネージャーを使用している場合、次のようなマークアップがある可能性があります。

親マークアップ:

<div class="modal fade" id="addThingModal" tabindex="-1" role="dialog" aria-labelledby="addThingModalLabel" aria-hidden="true">
    <div data-bind="module: { name: 'addThing'}"></div>
</div>

テンプレート：

<div id="addThingTemplate" class="modal-dialog">
   ...
</div>

スクリプトは「#addThingTemplate」ではなく「#addThingModal」をターゲットにする必要があります

于 2016-03-25T18:00:33.160 に答える