bootstrap动态增加移除输入框组

首先是模板HTML部分

    

        

            产品价格
            

                
            
        
    
    

        

            招生省份
            

                
            
        
    
    

        
        
    
 

    

        

            产品价格
            

                
            
        
    
    

        

            招生省份
            

                
            
        
    
    

        
        
    

 然后是js部分

/**
 * 动态添加input组
 */
ProductInfoDlg.addPrices = function () {
    if (this.name > 0 && index == 0) {
        index = this.name;
    }
    index++;
    var $template = $('#priceTemplate'),
        $clone = $template
            .clone()
            .removeClass('hide')
            .removeAttr('id')
            .attr('data-price-index', index)
            .insertBefore($template);
    $clone
        .find('[name="pricesTemplate"]').attr('name', 'prices').end()
        .find('[name="provincesTemplate"]').attr('name', 'provinces').end();
};

/**
 * 动态移除input组
 */
ProductInfoDlg.delPrices = function (e) {
    var target = $(e).parents(".form-group");
    target.remove();
};

/**
 * 获取并处理价格和省份数据
 */
ProductInfoDlg.setProvincePrice = function () {
    var provincePrice = [];
    var prices = $("*[name='prices']").map(function () {
        return $(this).val()
    }).get();
    var provinces = $("*[name='provinces']").map(function () {
        return $(this).val()
    }).get();
    for (var i = 0; i < prices.length; i++) {
        if (!prices[i] || !provinces[i]) {
            continue;
        }
        provincePrice.push({price: prices[i], province: provinces[i]})
    }
    this.productInfoData['provincePrice'] = provincePrice.length == 0 ? null : JSON.stringify(provincePrice);
};