正则表达式将成分1更改为“成分”+计数器

时间:2014-08-12 11:26:48

标签: javascript jquery regex

我在克隆div时尝试更改label标记。当前的JS更改了下拉列表中的产品名称。

var clone = $('#product-1').clone(false)[0].outerHTML.replace(/1/g, counter);

<div class="activeingredients">
    <div class="products" id="product-1">
        <label>Active Ingredient 1</label>
        <ul>
            <li style="display:inline-block">
                <select name="productid">
                    <option>Product 1</option>
                </select>
            </li>
        </ul>
    </div>
</div>

http://jsfiddle.net/ehv1xmL6/

谢谢

1 个答案:

答案 0 :(得分:1)

有几种方法可以做到这一点,包括只有一个没有数字的字符串,可以替换标签文本。但是,按照您已经拥有的内容,我做了以下更改:

我首先在标签上添加了一个类,以便于选择。您当前的代码选择div中的所有数字。

<label class="ingredientLabel">Active Ingredient 1</label>

其次,我克隆了div。然后选择.ingredientLabel里面的html并使用Regex更改了数字。我更改了正则表达式以找到字符串中的任何数字而不仅仅是&#39; 1&#39;如果数字由于某种原因而改变。

$(document).ready(function(){
    var counter = 1;
    $("#addproduct").click(function(){
        counter+= 1;
        var clone = $('#product-1').clone(false);
        clone.find(".ingredientLabel").html(clone.find(".ingredientLabel").html().replace(/[0-9]+/g, counter));
        $(clone).appendTo(".activeingredients")
    });
});

这是工作小提琴:JSFiddle