JavaScript-替换名称属性中第一个方括号之间的值

Question

I got inputs with names like this:

<input class="serialize" name="day[0][0]" />
<input class="serialize" name="event[0][0][0][0]" />

What I want to do is to replace the character in the first clamp (day[ 0 ][0], event[ 0 ][0][0][0]) ... But the characters in the clamps may change ...

Here is a first code draft

jQuery( this ).find( '.serialize' ).each( function( index ) {

    var attr = jQuery( this ).attr( 'name' );
    attr = attr.replace( 'regex magic' ); // This line is the problem
    jQuery( this ).attr( 'name', attr );

} );

Answer 1

The .attr() method accepts a function, so you don't need to manually iterate over each element, retrieve the name attribute and update it.

You can just pass a function and return the replaced attribute:

$('.serialize').attr('name', function () {
  return this.name.replace(/^(\w+)\[.*?\]/, '$1[20]');
});

The expression /^(\\w+)\\[.*?\\]/ will select the first set of brackets after one or more \\w characters (which are then captured and then replaced).

Which would return:

<input class="serialize" name="day[20][0]">
<input class="serialize" name="event[20][0][0][0]">

As a side note, \\w+ will match one or more of the following characters: [a-zA-Z0-9_] . If the characters differ, you may want to use:

$('.serialize').attr('name', function () {
  return this.name.replace(/^(.*?)\[.*?\]/, '$1[20]');
});

---

Alternatively, if you want to update the value in the first set of brackets based on the index, you could use:

$('.serialize').attr('name', function (i) {
  return this.name.replace(/^(\w+)\[.*?\]/, '$1[' + i + ']');
});

Which would return:

<input class="serialize" name="day[0][0]">
<input class="serialize" name="event[1][0][0][0]">
<input class="serialize" name="somethingelse[2][0][0][0]">