Question

按钮关闭，按钮最小化和按钮设置无法使用以下javascript。

我使用boostrap 2.0.4

//datatable
    $('.datatable').dataTable({
            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span12'i><'span12 center'p>>",
            "sPaginationType": "bootstrap",
            "oLanguage": {
            "sLengthMenu": "_MENU_ records per page"
            }
        } );
    $('.btn-close').click(function(e){
        e.preventDefault();
        if (e.target === this)
                $(this).parent().parent().parent().fadeOut();
    });
    $('.btn-minimize').click(function(e){
        e.preventDefault();
        var $target = $(this).parent().parent().next('.box-content');
        if($target.is(':visible')) $('i',$(this)).removeClass('icon-chevron-up').addClass('icon-chevron-down');
        else                       $('i',$(this)).removeClass('icon-chevron-down').addClass('icon-chevron-up');
        $target.slideToggle();
    });
    $('.btn-setting').click(function(e){
        e.preventDefault();
        $('#myModal').modal('show');
    });

编辑1：我正在尝试使用此模板表http://usman.it/themes/charisma/table.html 您可以在那里下载table.html文件。我无法理解的另一件事是当我检查html代码时，没有SEARCH文本输入，没有页面导航。他们如何走出浏览器？

编辑2：我正在使用Google App Engine，Django，Jinja2

Answer 1

如果您要将button动态添加到DOM，则click()可能无效。

试试这个：

$(document).on("click", '.btn-close', function(e){
    e.preventDefault();
    if (e.target === this)
            $(this).parent().parent().parent().fadeOut();
});

$(document).on("click", '.btn-minimize', function(e){
    e.preventDefault();
    var $target = $(this).parent().parent().next('.box-content');
    if($target.is(':visible')) $('i',$(this)).removeClass('icon-chevron-up').addClass('icon-chevron-down');
    else                       $('i',$(this)).removeClass('icon-chevron-down').addClass('icon-chevron-up');
    $target.slideToggle();
});

$(document).on("click", '.btn-setting', function(e){
    e.preventDefault();
    $('#myModal').modal('show');
});

Answer 2

$('.datatable').dataTable({
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span12'i><'span12 center'p>>",
        "sPaginationType": "bootstrap",
        "oLanguage": {
        "sLengthMenu": "_MENU_ records per page"
        }
    } );
$('.btn-close').click(function(e){
    e.preventDefault();
    $(this).parent().parent().parent().fadeOut();
});
$('.btn-minimize').click(function(e){
    e.preventDefault();
    var $target = $(this).parent().parent().next('.box-content');
    if($target.is(':visible')) 
      $('i',$(this)).removeClass('icon-chevron-up').addClass('icon-chevron-down');
    else
      $('i',$(this)).removeClass('icon-chevron-down').addClass('icon-chevron-up');
    $target.slideToggle();
});
$('.btn-setting').click(function(e){
    e.preventDefault();
    $('#myModal').modal('show');
});

使用以下javascript按钮关闭，按钮最小化和按钮设置不起作用

2 个答案: