Создание динамических имен для входов, созданных jquery append

0

У меня есть HTML, как показано ниже:

NOF:
<input type="text" class="nof" />

<div class="myfld">
</div>

И jquery:

html = '';
var html = 'Name : <input type="text" name="ss" />';
var html = html + 'Email : <input type="text" name="email" />';

$('.nof').keyup(function(){
$('.myfld').empty();
    nof = $('.nof').val();
    for(var x = 0;  x < nof; x++) {
        $('.myfld').append(html);
    }
});

Когда я набираю ключ, он создает динамические поля ввода и до этого момента работает хорошо. Но проблема в том, что все созданные поля имеют то же имя, что и ss и email. Так как я могу сделать эти имена, как ss1, email1, ss2, email2 и так далее?

DEMO

Теги:
for-loop
input
keyup

4 ответа

0
Лучший ответ

Попробуйте что-то вроде этого

$('.nof').keyup(function(){
$('.myfld').empty();
    nof = $('.nof').val();
    for(var x = 0;  x < nof; x++) {
        $('.myfld').append('Name : <input type="text" name="ss_'+x+'" />Email : <input type="text" name="email_'+x+'" /><br/>');
    }
});

каждый раз, когда вы добавляете входы, вы также меняете имя входов, поэтому для трех входов у вас есть что-то вроде ss_0/email_0, ss_1/email_1, ss_3/email_3

0

Вы можете заменить "Соль" на каждой итерации следующим образом:

html = '';
var html = 'Name : <input type="text" name="ssFOO" />';
var html = html + 'Email : <input type="text" name="emailFOO" />';
var html = html + '<br />';

$('.nof').keyup(function(){
$('.myfld').empty();
    nof = $('.nof').val();
    for(var x = 0;  x < nof; x++) {
        var newHtml = html.replace(/FOO/g, String(x));
        $('.myfld').append(newHtml);
    }
});

демонстрация

0

вы можете проверить эту обновленную демонстрацию скрипта [http://jsfiddle.net/49gJG/7/] Demo

0

Вы можете перемещать соответствующие строки внутри цикла

var html = ''; 
for (var x...) {
html = 'Name : <input type="text" name="ss' + x + '" />';

то же самое для электронной почты

Ещё вопросы

Сообщество Overcoder
Наверх
Меню