附加具有相同選項但名稱不同的選擇框

Question

如何附加具有相同選項和不同名稱的選擇框。 我有一個循環，其中我的php讀取sql表，並為每一行創建一個選項標簽

這是要附加的功能：

$(function(){
    $('#add').click(function(){
        var select = $('span[id=combo]').html();
        $('#allCombo').append('<br/><span id="combo">'+select+'</span>');
    });
});

這是選擇框：

<span id="allCombo">
                <span id="combo" name="combo">
                    <select name="item">
                        <?php foreach ($items as $item) { ?>
                            <option value="<?php echo $item->item_id; ?>">
                            <?php echo $item->item_name; ?></option>
                        <?php } ?>
                    </select>
                </span>
</span>

誰能幫我。 之前感謝。

Answer 1

$(function(){
    $('#add').click(function(){
        var select = $('#combo').html();
        $('<br/><span id="combo">'+select+'</span>').appendTo('#allCombo').find.('select').attr('name', 'uniqueName');
    });
});

Answer 2

var newSelect = $('select[name=item]').clone().attr('name', 'newselect');
$('#allCombo').append(newSelect);

Answer 3

您始終可以使用clone方法：

var new_combo $('span#combo').clone();
new_combo.attr('name', 'second_combo');
new_combo.attr('id', 'second_combo'); // for valid html
$('#allCombo').append(new_combo);

Answer 4

使用item[]作為名稱。 PHP將其轉換為數組，因此選定的值將存儲在$_POST['item']的數組中。

但更重要的是不要重復ID。 我建議完全去除內部span ，因為

1. 您不能有重復的ID，並且
2. span標簽沒有name屬性

因此無需保留此標簽。

<span id="allCombo">
    <select name="item[]">
        <?php foreach ($items as $item): ?>
            <option value="<?php echo $item->item_id; ?>">
                <?php echo $item->item_name; ?>
            </option>
       <?php endforeach; ?>
     </select>
</span>

JS代碼為：

$(function(){
    $('#add').click(function(){
        $('#allCombo')
           .append('<br />')
           .append($('#allCombo select').first().clone());
    });
});