0

2 つのフォーム要素を複数回複製しようとしています。選択ボックスとそのラベルですが、要素を複製するたびに、配列からラベル テキストを提供したいと考えています。私はこれに正しい方法で取り組んでいますか、それとも別の方法を試す必要がありますか

<a href="#" onClick="createElement(5)">CLICK ME</a>
    <div id="selectBox1" class="cloned">
        <label>LABEL</label>
        <select name="name1" id="name1">
            <option>ONE</option>
            <option>TWO</option>
            <option>THREE</option>
        </select>
    </div>
</a>

function createElement(numElements) {
    //alert(numElements);

    //LABEL ARRAY
    var labels = [
        'Market',
        'Store',
        'Report Level',
        'Start Date',
        'End Date'];


    for (i = 0; i < numElements-1; i++) {                    
        var num = $('.cloned').length;//HOW MANY WE HAVE              
        var newNum = new Number(num + 1); //NUMBER OF ELEMENT BEING ADDED

        //LABEL
        //var newLabel = $('#selectLabel' + num).clone().attr('id', 'selectLabel' + newNum);//CLONE LABEL
        //newLabel.children(':first').attr('id', 'name' + newNum);//UPDATE NAME/ID

        //SELECTBOX
        var newElem = $('#selectBox' + num).clone().attr('id', 'selectBox' + newNum);//CLONE SELECTBOX
        newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);//UPDATE NAME/ID

        //$('#selectLabel' + num).after(newLabel);//INSERT THE NEW LABEL
        $('#selectBox' + num).after(newElem);//INSERT THE NEW ELEMENT
        }
    }
4

1 に答える 1

0

これを試して：

$(function() {
    //LABEL ARRAY
    var labels = [
        'Market',
        'Store',
        'Report Level',
        'Start Date',
        'End Date'
    ];
    var count = labels.length;

    $('#selectBox1').bind('click', function() {
        var self = $(this);
        var clones = $();
        var num = $('.cloned').length;

        $.each(labels, function(index, label) {
            var clone = self.clone();

            clone.attr({id: 'selectBox'+(++num)'});
            clone.find('label').attr({
                id: 'name'+num,
                name: 'name'+num
            }).text(label);

            clones = clones.add(clone[0]);
        });

        $('.cloned:last').after(clones);
    });
});
于 2012-10-11T16:53:18.960 に答える