Question

我有2个按钮添加和分组。最初隐藏组按钮。添加按钮用于创建记录。

所以例如：创建5条记录时（按5次添加按钮）。现在，如果用户选择了多个 checkbox，然后应显示隐藏的组按钮。请问有谁可以告诉我怎么做？

请参阅此fiddle

我正在使用bootstrap css并隐藏我做

<input type="button" id="btn2" class="btn btn-lg btn-primary hide" value="Group">

更新复选框仅在用户输入某些记录时出现。填写表单并按下添加按钮

Answer 1

请参阅此FIDDLE

$(document).on('change','#mytable input:checkbox',function () {
    if($('#mytable input:checkbox:checked').length > 1) {
        $('#btn2').removeClass('hide')
    }
    else {
        $('#btn2').addClass('hide')
    }
});

Answer 2

在change事件中添加一个选中复选框。 fiddle以及以下示例：

$(document).on('change','#mytable input:checkbox',function () {
    if(!this.checked)
    {
        key=$(this).attr('name').replace('mytr','');
        alert(key);
        obj[key]=null;
    }

    //updated using your bootstrap class to show/hide
    if($('#mytable input:checkbox:checked').length > 1) {
        $('#btn2').removeClass('hide');
    } else {
        $('#btn2').addClass('hide');
    }

});

已更新以根据您更新的问题使用bootstrap类。

Answer 3

这是 FIDDLE

    if($('#mytable input:checkbox:checked').length > 1)
        $('#btn2').show();
    else
        $('#btn2').hide();

Answer 4

试试这个

    var val = 0;
var groupTrCount = 0;
$(document).ready(function () {
    var obj={};
    $('#btn1').click(function () {
        if ($(".span4").val() != "") {
            $("#mytable").append('<tr id="mytr' + val + '"></tr>');
            $tr=$("#mytr" + val);
            $tr.append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr' + val + '" unchecked ></td>');
            $(".span4").each(function () {
                $tr.append("<td >" + $(this).val() + "</td>");
            });
            var arr={};
            name=($tr.find('td:eq(1)').text());
            email=($tr.find('td:eq(2)').text());
            mobile=($tr.find('td:eq(3)').text());
            arr['name']=name;arr['email']=email;arr['mobile']=mobile;
            obj[val]=arr;
            val++;
        } else {
            alert("please fill the form completely");
        }
    });
    $(document).on('click', '#btn2',function () {
        var creat_group = confirm("Do you want to creat a group??");
        if (creat_group) {
            console.log(obj);

            $tr.append("<td >" + groupTrCount + "</td>");

$("#groupsTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
    $tr=$("#groupTr" + groupTrCount);
    $tr.append("<td >Group:" + groupTrCount + "</td>"); // or you can use whatever name you want in place of "Group:"
    var userColumn = "<ul>";
    $('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
      var count=0;
      $(this).find('td').each(function() {
         if(count == 1){
        userColumn+= "<li>" + $(this).html() + "</li>" ;
         }
         count++;
    });
});;
            userColumn+="<ul>";
            $tr.append("<td >" +userColumn+ "</td>");
        groupTrCount++;
        }        
    });
    $(document).on('change','#mytable input:checkbox',function () {
        var rowCount = $('#mytable tr').length;
        if($('input:checkbox:checked').length > 1 && rowcount > 6) {
        $('#btn2').removeClass('hide')
    }
    });
});

更新小提琴是：http://jsfiddle.net/4GP9c/184/

如果选中多个复选框，如何显示隐藏按钮

4 个答案: