无法使用jQuery更改属性值

Question

我有以下要素：

<span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="VariableDataList[0].VariableDataForLevel[1].Value"></span>

我想替换data-valmsg-for的值， data-valmsg-for更改.Value之前的数字。 为此，我使用此函数（ latestIdNumber和newIdNumber是我在函数开始时计算的值，但可以想象一下， latestIdNumber为1且newIdNumber为2）：

clone.find("span[data-valmsg-for$='Value']").map(function () {
    var reName = '[' + latestIdNumber + '].Value';
    $(this).attr('data-valmsg-for').replace(reName, '[' + newIdNumber + '].Value');
});

reName值为[1].Value 。 我想用[2].Value替换data-valmsg-for 。 之后，我将在data-valmsg-for值data-valmsg-for="VariableDataList[0].VariableDataForLevel[2].Value 。

我已经用Visual Studio调试了它，它在查找中停止，但是属性的值没有改变。

我知道属性值不会更改，因为我已经打开了Internet Explorer调试器，但是看不到新值。

我已经尝试过相同的方法，更改输入字段的id和name并replace功能可以完美地工作。

如何替换该属性的值？

Answer 1

首先，您应该使用each()来遍历元素集合。 map()旨在从该集合创建一个数组，尽管在这种情况下，如果您正确使用attr()也不是必需的。

代码的问题是因为您没有调用attr()的设置方法。 取而代之的是获取值，执行替换，但对结果不执行任何操作。

为了解决这个问题，您可以为attr()方法提供一个函数，该函数对集合中元素的每个实例执行逻辑。 尝试这个：

 var latestIdNumber = '1'; var newIdNumber = '999'; var reName = '[' + latestIdNumber + '].Value'; $("span[data-valmsg-for$='Value']").attr('data-valmsg-for', function(i, v) { return v.replace(reName, '[' + newIdNumber + '].Value'); }); // to show it worked: $("span[data-valmsg-for$='Value']").each(function() { console.log($(this).attr('data-valmsg-for')); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="VariableDataList[0].VariableDataForLevel[1].Value">Foo</span> <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="VariableDataList[0].VariableDataForLevel[1].Value">Bar</span> 

还要注意，您应该真正使用data()方法来处理data-*属性。 需要说明的是data()不会更新DOM，因此，如果您需要该行为，则需要继续使用attr() 。