jQuery - заполнение форм - классы с динамическим именем php

Question

Я новичок в jQuery и имею следующую проблему: у меня есть пара сгенерированных php форм.Каждая форма имеет флажок и 5 полей ввода.Каждое поле ввода имеет имя класса, сгенерированное с помощью php: первая часть имени всегда одна и та же, но конец меняется, чтобы различать классы (номера идентификаторов не используются, например, 1, 2, 5 и т. Д.)

Выход html (я думаю, здесь нет проблем):

<input class="same--1" name="same" type="checkbox" />
<div id="1"><input type="text" name="foo[]" class="first--1" value="" /></div>
<div id="2"><input type="text" name="foo[]" class="rest--1" value="" /></div>
<div id="3"><input type="text" name="foo[]" class="rest--1" value="" /></div>
<div id="4"><input type="text" name="foo[]" class="rest--1" value="" /></div>
<div id="5"><input type="text" name="foo[]" class="rest--1" value="" /></div>
<br></br>
<input class="same--2" name="same2" type="checkbox" />
<input type="text" name="foo[1]" class="first--2" value="" />
<input type="text" name="foo[2]" class="rest--2" value="" />
<input type="text" name="foo[3]" class="rest--2" value="" />
<input type="text" name="foo[4]" class="rest--2" value="" />
<input type="text" name="foo[5]" class="rest--2" value="" />
<br></br>
<input class="same--8" name="same8" type="checkbox" />
<input type="text" name="foo[1]" class="first--8" value="" />
<input type="text" name="foo[2]" class="rest--8" value="" />
<input type="text" name="foo[3]" class="rest--8" value="" />
<input type="text" name="foo[4]" class="rest--8" value="" />
<input type="text" name="foo[5]" class="rest--8" value="" />
<script type="text/javascript" >

Я пытаюсь написать следующую функцию jQuery: когда первое поле заполнено, пользователь выбирает флажок изначение копируется в другое поле (как показано здесь jQuery для заполнения полей формы с именем массива на основе первого введенного значения, где число полей неизвестно , но для нескольких форм).Следующий код всегда возвращает неопределенное значение.Любая помощь могла бы быть полезна!Заранее спасибо.

$(function(){
    $.each('input[class^= "same--"]').click(function(){

        var id = $(this).attr('same').split('--')[1];

            if($(this).is(':checked'))
            {
                $('.rest' + id).val($('.first' + id).val());
            }
            else
            {
                $('.rest' + id).val('');
            }
    });
});

Answer 1

JQuery разрешает селекторы, которые определяют подстроки.Вы можете сделать что-то вроде этого:

$('[class^="same"]')

..., который будет искать элементы с классом, который начинается со слова «то же самое».

Однако это будет проще (именьше налогов на браузер), если бы вы могли просто ссылаться на фиксированное имя класса.Поскольку ваш код генерируется PHP, вы сможете изменить его?HTML позволяет указывать несколько классов для одного элемента, поэтому вы можете продолжать иметь существующий класс, а также иметь более общий.Примерно так:

<input class="same--2 same" name="same2" type="checkbox" />

... тогда вы все еще можете использовать same--2 там, где вы уже его используете, но вы можете использовать same, где вы хотите применить что-то для всех связанных элементов, используя простой селектор вот так:

$('.same')

Надеюсь, это поможет.

Answer 2

var id = $(this).attr('same').split('--')[1];

Я думаю, вы имели в виду

var id = $(this).attr('class').split('--')[1];

Answer 3

Вы хотите использовать атрибут класса.

Я думаю, что вы действительно должны сделать это так:

var id = $(this).attr('class').substring(4);

Вам также не нужен $ .each.Это будет хорошо работать:

$('input[class^= "same--"]').click(function(){

Хотя я уверен, что есть лучший способ сделать это, используя другие селекторы jQuery, если вы можете немного изменить html, чтобы окружать каждую группу входов в div.