twitter bootstrap模态对话框

Mih*_*anu 3 jquery modal-dialog twitter-bootstrap

我有一个Twitter Bootstrap模式对话框的问题.
HTML代码:

<div class="container">
    <div class="delete_dosar">delete</div>
</div>

<!-- Boostrap modal dialog -->
<div id="delete_confirmation" class="modal hide fade" style="display: none; ">
    <div class="modal-header">
        <a href="#" class="close" data-dismiss="modal">x</a>
        <h3>Are you sure?</h3>
    </div>
    <div class="modal-body">
        <div class="paddingT15 paddingB15" id="modal_text">    
        Are you sure with this?
        </div>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn confirm_delete_the_item no_return">yes</a>
        <a href="#" class="btn btn-secondary " data-dismiss="modal">no</a>
    </div>
</div>?
Run Code Online (Sandbox Code Playgroud)

JS代码:

$(function() {
$(".delete_dosar").live('click',function(){

    $('#delete_confirmation').modal("show");
    $('.confirm_delete_the_item').live('click',function(e){
        $('#delete_confirmation').modal("hide");
        //e.preventDefault();
        alert('x');
    });

    return false;
});
});?
Run Code Online (Sandbox Code Playgroud)

代码在这里运行:http://jsfiddle.net/darkwish02/u7hEv/

如果我点击"删除"和"是",我第一次只有一个提醒,但如果我再次点击"删除"(没有刷新),我将有2个提醒.

事件"点击"似乎连续2次运行.

feg*_*emo 7

你正在做的方式是,每次单击删除按钮时都会附加一个新的点击处理程序.

您应该将内部单击处理程序插入移出第一个.然后,"是"按钮将始终只有一个处理程序.

这个小提琴显示它工作:http://jsfiddle.net/KSxJs/

$(function() {

    $('.confirm_delete_the_item').live('click', function(e) {
        $('#delete_confirmation').modal("hide");
        //e.preventDefault();
        alert('x');


    });


    /** SETERGERE DE DOSAR DIN PARTEA STANGA **/
    $(".delete_dosar").live('click', function() {

        $('#delete_confirmation').modal("show");

        return false;

    });
});?
Run Code Online (Sandbox Code Playgroud)

  • 从jQuery 1.7开始,`live`已被弃用([见文档](http://api.jquery.com/live/)).由于Bootstrap需要> = 1.7,因此应该使用[`on`方法](http://api.jquery.com/on/). (3认同)