无法使克隆功能起作用?

时间:2014-06-09 16:58:37

标签: javascript jquery html5 twitter-bootstrap

我正在尝试让我的.js clone()函数克隆相同的表单并在克隆后给我相同的表单。 我是初学者,我正在尝试创建一个包含4个字段的表单的克隆。我参考http://tristandenyer.com/using-jquery-to-duplicate-a-section-of-a-form-maintaining-accessibility/尝试了很多东西 好像我真的很擅长这个。任何人都可以帮我解决这个问题,我做错了什么。感谢。

我的JavaScript代码是:

$(function () {
    $('#btnAdd').click(function () {
        var num     = $('.clonedInput').length, 
            newNum  = new Number(num + 1),      
            newElem = $('#Co_PI' + num).clone().attr('id', 'Co_PI' + newNum).fadeIn('slow'); 



        newElem.find('.heading-reference').attr('id', 'ID' + newNum + '_reference').attr('name', 'ID' + newNum + '_reference').html('Co_PI#' + newNum);


        newElem.find('.label_ttl').attr('for', 'ID' + newNum + '_title');
        newElem.find('.select_ttl').attr('id', 'ID' + newNum + '_title').attr('name', 'ID' + newNum + '_title').val('');


        newElem.find('.label_fn').attr('for', 'ID' + newNum + '_first_name');
        newElem.find('.input_fn').attr('id', 'ID' + newNum + '_first_name').attr('name', 'ID' + newNum + '_first_name').val('');


        newElem.find('.label_ln').attr('for', 'ID' + newNum + '_last_name');
        newElem.find('.input_ln').attr('id', 'ID' + newNum + '_last_name').attr('name', 'ID' + newNum + '_last_name').val('');



        newElem.find('.label_email').attr('for', 'ID' + newNum + '_email_address');
        newElem.find('.input_email').attr('id', 'ID' + newNum + '_email_address').attr('name', 'ID' + newNum + '_email_address').val('');


        newElem.find('.label_inst').attr('for', 'ID' + newNum + '_institution');
        newElem.find('.input_inst').attr('id', 'ID' + newNum + '_institution').attr('name', 'ID' + newNum + '_institution').val('');


        $('#Co_PI' + num).after(newElem);
        $('#ID' + newNum + '_title').focus();


        $('#btnDel').attr('disabled', false);


        if (newNum == 5)
        $('#btnAdd').attr('disabled', true).prop('value', "You've reached the limit"); 
    });

    $('#btnDel').click(function () {

        if (confirm("Are you sure you wish to remove this section? This cannot be undone."))
            {
                var num = $('.clonedInput').length;
                // how many "duplicatable" input fields we currently have
                $('#Co_PI' + num).slideUp('slow', function () {$(this).remove();
                // if only one element remains, disable the "remove" button
                    if (num -1 === 1)
                $('#btnDel').attr('disabled', true);
                // enable the "add" button
                $('#btnAdd').attr('disabled', false).prop('value', "add section");});
            }
        return false; // Removes the last section you added
    });
    // Enable the "add" button
    $('#btnAdd').attr('disabled', false);
    // Disable the "remove" button
    $('#btnDel').attr('disabled', true);
});

0 个答案:

没有答案