Question

我正在尝试根据标签的当前内容替换一系列'for'属性。

应用程序正在使用AJAX将项目添加到发票而不刷新页面。在收到成功添加项目的通知后，我的脚本应该替换“for”属性以'-new'结尾的表单中的所有标签，使用相同的属性减去'-new'并添加（' - '+ itemValue），其中itemValue是已添加的发票项目的项目ID。

我知道如何选择我想要立即更改的所有标签：

jQuery('label[for$=new]')

我知道如何获取'for'属性：

jQuery('label[for$=new]').attr('for')

我尝试了JavaScript替换方法：

jQuery('label[for$=new]').attr('for').replace(/-new/,itemValue)

但是这似乎选择了每个标签的'for'属性，替换了文本，并将替换的文本传回（没有），因为我不知道如何识别具有我想要的'for'属性的标签替换。

以下是一些示例HTML：

<form id="InvoiceItemsForm-1" action="<?=$_SERVER['PHP_SELF'];?>" method="post" name="InvoiceItemsForm-1" onsubmit="return false">
<div id="InvoiceItem-new-1" class="InvoiceItem">
<label for="InvoiceItemNumber-new">New Invoice Item Number: </label>
<input id="InvoiceItemNumber-new" class="InvoiceItemNumber" type="text" value="" name="InvoiceItemNumber-new">
<label for="InvoiceItemDescription-new">Item Description: </label>
<input id="InvoiceItemDescription-new" class="InvoiceItemDescription" type="text" value="" name="InvoiceItemDescription-new">
<label for="InvoiceItemAmount-new">Item Amount: </label>
<input id="InvoiceItemAmount-new" class="InvoiceItemAmount" type="text" value="" name="InvoiceItemAmount-new">
<input id="addInvoiceItem-1" width="25" type="image" height="25" src="/payapp/images/greenplus.th.png" alt="Add New Invoice Item" onclick="addInvoiceItemButtonPushed(this)" value="invoiceItem">
</div>
<button id="CloseInvoice-1" onclick="closeInvoice(this)" type="button">Close Invoice</button>
</form>

一旦我开始工作，我将替换所有输入的所有ID。同样的问题。我想解决方案看起来像这样：

jQuery('input[id$=new]').attr('id').replace(/-new/,itemValue)

我根本无法弄清楚这个的语法。

Answer 1

无需使用.each() ... .attr()方法接受函数作为第二个参数，返回要用作替换的新值

jQuery('label[for$=new]').attr('for', function(index, currentValue){
   return currentValue.replace(/-new/,'-' + itemValue);
});

Answer 2

不确定我是否得到了这个问题，但是：

var oldFor = $('label[for$=new]').attr('for');
var newFor = oldfor.replace(/-new/,itemValue);

$('label[for$=new]').attr('for', newFor);

.attr（attributeName，value）

attributeName = The name of the attribute to set.
value = A value to set for the attribute.

选择多个元素时，您需要迭代：

$('label[for$=new]').each(function(index) {
  $(this).attr('for', $(this).attr('for').replace(/-new/, '-' + itemValue));
});

Answer 3

如果可以，为什么不将input标记放在label标记内？这样，for代码中就不需要label属性。

接下来，更好的方法来完成您尝试执行的操作，即使用发票ID号作为周围div的ID，并为“新”发票条目添加“新”类

所以你的表格看起来像这样：

<form id="InvoiceItemsForm-1" action="<?=$_SERVER['PHP_SELF']" method="post" name="InvoiceItemsForm-1" onsubmit="return false">   
    <div class="InvoiceItem new">   
        <label>New Invoice Item Number: <input class="InvoiceItemNumber" type="text" value="" name="InvoiceItemNumber"></label>   
        <label>Item Description: <input class="InvoiceItemDescription" type="text" value="" name="InvoiceItemDescription-new"></label>   
        <label for="InvoiceItemAmount-new">Item Amount: <input class="InvoiceItemAmount" type="text" value="" name="InvoiceItemAmount-new"></label>   
        <input id="addInvoiceItem-1" width="25" type="image" height="25" src="/payapp/images/greenplus.th.png" alt="Add New Invoice Item" onclick="addInvoiceItemButtonPushed(this)" value="invoiceItem">   
    </div>   
    <button id="CloseInvoice-1" onclick="closeInvoice(this)" type="button">Close Invoice</button>   
</form>

您仍然拥有获取新发票项目字段数据所需的所有目标性，但现在，您只需要执行两项操作即可将“新”发票行转换为“现有”发票项目行：将id属性添加到div并删除new类，这两个jQuery都可以让您轻松完成。

如何在jQuery中替换一组元素的部分属性值？

3 个答案: