1

目前,我有一个功能,可以通过单击一个按钮添加一组字段,然后单击一个按钮将它们全部删除,以添加与会者的表单。

我在添加白色块中的 3 行时遇到了困难,这 3 行在调用点击的同时增加了与会者的数量,并添加了一组字段来填写。

我试过在之后创建一个回调

 next.slideDown('slow'); to next.slideDown('slow', function(){ ... });

但没有成功。

我如何将这些与事件结合起来一键单击?

http://jsfiddle.net/h76KR/1/

$(document).ready(function () {
    $('#div2, #div3, #div4').hide();
    $('#add').click(function () {
        var curr = $(".question:visible");
        var next = curr.next(".question");
        next.slideDown('slow');

var theTotal = 0;

theTotal = Number(theTotal) + Number($(this).val());

$('.noOfAttendees').text(贵公司的与会者总数:"+theTotal");

    });
    $('#remove').click(function () {
        var prev = $(".question:visible");
        var remove = prev.next(".question");
        remove.slideUp();
    });
});
4

2 回答 2

1

正是您的要求是这样的:http: //jsfiddle.net/h76KR/3/

带一个

var numEmployees = 1;

您只需根据需要增加和减少,然后使用

function updateEmployees(){
     $(".noOfAttendees").html("There are "+numEmployees+" Attendees");   
}

更新盒子。


顺便说一句,用你克隆的员工信息保留一个空的、隐藏的 div 可能会好得多。然后,您可以拥有无​​限个这样的克隆,而不仅仅是四个。以你的例子,尝试这样做:

var employeeDiv = $("#div1").clone();
$("#div1").append(employeeDiv);

并从那里工作。

于 2013-06-14T13:51:40.513 回答
0

好的,所以我发现我不需要将它组合成一个函数,我在下面创建了以下内容,并在单击删除按钮时将其重置为 1。如果有人知道这样做的更有效方法,请告诉我,改进逻辑和方法总是好的。

http://jsfiddle.net/nYHNk/1/

$(document).ready(function (){
$('#div2, #div3, #div4').hide();
$('#add').click(function(){
     //code
    var curr = $(".question:visible");
    var next = curr.next(".question");
    next.show();

});

$('#remove').click(function(){
    var prev = $(".question:visible");
    var remove = prev.next(".question");
    remove.hide();
});    
});

var oneAtt = 1;
var theTotal = 1;
$('#add').click(function(){
theTotal = Number(theTotal) + Number($(this).val());
$('.total').text("Total: "+theTotal);        
});

$('.total').text("Total: "+theTotal);        

$('#remove').click(function (){
    theTotal = oneAtt;
   $('.total').text("Total: "+oneAtt); 
});
于 2013-06-14T14:24:06.597 回答