使用数组中的值替换字符串中的值的Javascript代码

时间:2014-05-06 07:50:15

标签: javascript arrays string dynamic-arrays

我有一个看起来像这样的字符串:

<input type='checkbox' name='list' class='indent-28' value = 'ABC' name='Netherlands'>
    <label>Netherlands</label><br>                  
<input type='checkbox' name='list' class='indent-28' value = 'DEF' name='Germany'>
    <label>Germany</label><br>                      
<input type='checkbox' name='list' class='indent-28' value = 'GHI' name='Italy'>
    <label>Italy</label><br>                        
<input type='checkbox' name='list' class='indent-44' value = 'JKL' name='Brazil'>
    <label>Brazil</label><br>                       
<input type='checkbox' name='list' class='indent-44' value = 'MNO' name='Argentina'>
    <label>Argentina</label><br>                    
<input type='checkbox' name='list' class='indent-44' value = 'PQR' name='Argentina'>
    <label>Argentina</label><br>

我还有两个JavaScript数组,它们是根据最终用户选择的复选框动态生成的,并且具有他/她想要为这些选定项目输入的相应值。

因此,假设用户从上面的列表中选择"Netherlands","Germany","Argentina""Argentina",则第一个数组将为["Netherlands","Germany","Argentina","Argentina"]

此外,如果用户希望修改这些属性的值,他/她可以通过在我在应用程序中提供的文本框中输入新值来实现。
(在这种情况下,假设X,Y,Z,W是用户希望输入的新值。因此,第二个数组将是["X","Y","Z","W"]

现在,我有两个数组,我只想将上面字符串中的属性值替换为修改过的数组中的属性。

所需的输出/结果将是这样的:

<input type='checkbox' name='list' class='indent-28' value = 'X'   name='Netherlands'>
    <label>Netherlands</label><br>                   
<input type='checkbox' name='list' class='indent-28' value = 'Y'   name='Germany'>
    <label>Germany</label><br>                       
<input type='checkbox' name='list' class='indent-28' value = 'GHI' name='Italy'>
    <label>Italy</label><br>                         
<input type='checkbox' name='list' class='indent-44' value = 'JKL' name='Brazil'>
    <label>Brazil</label><br>                        
<input type='checkbox' name='list' class='indent-44' value = 'Z'   name='Argentina'>
    <label>Argentina</label><br>                     
<input type='checkbox' name='list' class='indent-44' value = 'W'   name='Argentina'>
    <label>Argentina</label><br>

X,Y,ZW理想情况下应该分别替换字符串中的先前值ABC,DEF,MNOPQR

有人可以帮我解决这个问题吗?

2 个答案:

答案 0 :(得分:0)

您可以在字符串中搜索要删除的文本,然后将其替换为您要输入的文本,即:

(str =你的文字字符串)

for (i=0; i<str.length; i++)
{
  if (str.substr(i,3)=="ABC")
  {
    str = str.substr(0,i)+"X"+str.substr((i+3),(str.length-(i-3));
  }

  //...and this could be repeated for each thing that you want to replace
}

然后你也可以使它完全动态

答案 1 :(得分:0)

您可以使用正则表达式在字符串中搜索模式,然后将第一个事件替换为包含新值的字符串。

var cty = ["Netherlands", "Germany", "Argentina", "Argentina"];
var val = ["X", "Y", "Z", "W"];

for (var i = 0; i < cty.length; i++) {
    var find = new RegExp("value='[^']*' name='" + cty[i] + "'");
    var repl = "value='" + val[i] + "' name='" + cty[i] + "'";

    str = str.replace(find, repl);
}

此代码未考虑第二个&#34;阿根廷&#34;价值得当。它会在第一次出现时替换它,覆盖第一次更改。第二个阿根廷的价值保持不变。

您可以通过一个小技巧解决这个问题:将值替换为后续搜索中不匹配的模式。在完成所有其他重播后,将假图案替换为所需图案。

var cty = ["Netherlands", "Germany", "Argentina", "Argentina"];
var val = ["X", "Y", "Z", "W"];

for (var i = 0; i < cty.length; i++) {
    var find = new RegExp("value='[^']*' name='" + cty[i] + "'");
    var repl = "value='" + val[i] + "' shname='" + cty[i] + "'";

    str = str.replace(find, repl);
}

str = str.replace(/ shname=/, " name=");

这应该会产生预期的结果。

但是,我并不相信这是最简单的解决方案。如果您的原始字符串是从类似的列表创建的,那么在这些列表上进行替换可能更容易,然后从头开始创建HTML标记字符串。

修改:这是我在Firefox中运行和测试的完整代码。阿根廷两次发生的值是"Z""W"

var str = ""
    + "<input type='checkbox' name='list' class='indent-28' value='ABC' name='Netherlands'>"
    + "<label>Netherlands</label><br>"
    + "<input type='checkbox' name='list' class='indent-28' value='DEF' name='Germany'>"
    + "<label>Germany</label><br>"
    + "<input type='checkbox' name='list' class='indent-28' value='GHI' name='Italy'>"
    + "<label>Italy</label><br>"
    + "<input type='checkbox' name='list' class='indent-44' value='JKL' name='Brazil'>"
    + "<label>Brazil</label><br>"
    + "<input type='checkbox' name='list' class='indent-44' value='MNO' name='Argentina'>"
    + "<label>Argentina</label><br>"
    + "<input type='checkbox' name='list' class='indent-44' value='PQR' name='Argentina'>"
    + "<label>Argentina</label><br>"
    ;

var cty = ["Netherlands", "Germany", "Argentina", "Argentina"];
var val = ["X", "Y", "Z", "W"];

console.log(str);

for (var i = 0; i < cty.length; i++) {
    var find = new RegExp("value='[^']*' name='" + cty[i] + "'");
    var repl = "value='" + val[i] + "' shname='" + cty[i] + "'";

    str = str.replace(find, repl);
}

str = str.replace(/ shname=/, " name=");

console.log(str);