如何将所选值复制到另一个选择框

时间:2015-06-11 11:28:45

标签: jquery html

点击+下图中的

它会生成另一行..但我想将第一行的选定值保留为新生成的行..

enter image description here

这是代码

<div class="row2">
</div>
<div class="row select_cart" style="margin-top:10px;">
    <div class="col-md-12">
        <div class="col-sm-4">
            <div class="new_select">
                <select class="form-control" id="colors">
                    <option>COLOR</option>
                </select>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="new_select">
                <select class="form-control" id="sizes">
                    <option>6-11</option>
                </select>
            </div>
        </div>
        <div class="col-sm-3 col-xs-10">
            <div class="new_select ">
                <select class="form-control qty" id="qty">
                    <option value="1">1</option>
                </select>
            </div>
        </div>
        <div class="col-sm-1 col-xs-2">
            <a class="add" id="newcross" title="add unlimited selections" style="cursor:pointer;">
                            <img src="<?php echo $this->getSkinUrl('images/item_add.png'); ?>" alt=""></a>
        </div>
    </div>
</div>

JS代码

jQuery(document).ready(function() {
    jQuery(".add").click(function() {
        var sizes = jQuery("#sizes").html();
        var colors = jQuery("#colors").html();

        var qnty = jQuery("#qty").html();
        var fld = ' <div class="row select_cart2" style="margin-top:10px;"> <div class="col-md-12"> <div class="col-sm-4"> <div class="new_select"> <select class="form-control" id="color2"> ' + colors + ' </select> </div> </div> <div class="col-sm-4"> <div class="new_select"> <select class="form-control" id="size2">' + sizes + '</select> </div> </div> <div class="col-sm-3 col-xs-10"> <div class="new_select "> <select class="form-control qty" id="qty2">' + qnty + ' </select> </div> </div> <div class="col-sm-1 col-xs-2"> <a class="delete" title="delete unlimited selections" style="cursor:pointer;"><img src="<?php echo $this->getSkinUrl("images/button_cancel.png"); ?>" alt="">  </a> </div> </div> </div>';
        jQuery('.row2').append(fld);
        var value = getqty();
        var value1 = parseInt(qty) + parseInt(value);
    });
    jQuery("div.row2").on("click", ".delete", function(e) {
        jQuery(this).closest(".row.select_cart2").remove();
        var qty = jQuery('.qty').val();
        var value = jQuery('#saveqty').html();
        var mjvalue = getqty();
        var value1 = parseInt(value) - parseInt(qty);
        jQuery('#saveqty').html(mjvalue);
        var price = thatTd.closest('tr').find('.td_price .price').html();
        price = price.substr(price.indexOf("$") + 1);
        var abc = parseInt(value1) * parseInt(price);


        jQuery('#totalprice').html('$' + abc);



        e.preventDefault();
    });
    jQuery("#myTab a").click(function(e) {
        e.preventDefault();
        jQuery(this).tab('show');
    });
});

1 个答案:

答案 0 :(得分:0)

    <div class="row2"></div>
    <div class="row select_cart" style="margin-top:10px;">
        <div class="col-md-12">
            <div id="select_cart">
                <div class="col-sm-4">
                    <div class="new_select">
                        <select class="form-control" id="colors">
                            <option>COLOR</option>
                        </select>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="new_select">
                        <select class="form-control" id="sizes">
                            <option>6-11</option>
                        </select>
                    </div>
                </div>
                <div class="col-sm-3 col-xs-10">
                    <div class="new_select ">
                        <select class="form-control qty" id="qty">
                            <option value="1">1</option>
                            <option value="2">2</option>
                        </select>
                    </div>
                </div>
//Jquery
jQuery(document).ready(function () {
    jQuery(".add").click(function () {
        $("#select_cart").children().clone(true,true).appendTo(".row2");

    });