Как использовать count в append text

Question

Я использую для множественного добавления текст с кнопкой как форму, и я хочу использовать счетчик для ввода или имени ввода изменения, но это не отражено в моем коде.

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

$('#singleTextbtn').on('click', function() { 
 
    singleLineText(); 
 
    console.log(count); 
 
    return false; 
 
}); 
 
var count = 0; 
 

 
function singleLineText() { 
 
    count++; 
 
    var slt = count + "count+<li><div class='formSection'+count> <label for='singleLineText_'+count>Single Line Text </label><input type='text' value='' name='singleLineText_'+count id='singleLineText_'+count /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 
 
    $('#rohit').append(slt); 
 

 
};

#singleTextbtn { 
 
    border: solid 1px red; 
 
    padding: 5px 10px; 
 
    float: left; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
 
<a href="#" id="singleTextbtn">click to add </a> 
 

 
<ul id="rohit"></ul>

Answer 1

Попробуйте следующее: Вы использовали счет как строку. просто добавлена ​​правильная конкатенация для переменной count.

$('#singleTextbtn').on('click', function() { 
    singleLineText(); 
    console.log(count); 
    return false; 
}); 
var count = 0; 

function singleLineText() { 
    count++; 
    var slt = count + "<li><div class='formSection_"+count+"'> <label for='singleLineText_"+count+"'>Single Line Text </label><input type='text' value='' name='singleLineText_"+count+"' id='singleLineText_"+count+"' /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 
    $('#rohit').append(slt); 

}; 

===========================

$('#singleTextbtn').on('click', function() { 
 
    singleLineText(); 
 
    console.log(count); 
 
    return false; 
 
}); 
 
var count = 0; 
 

 
function singleLineText() { 
 
    count++; 
 
    var slt = count + "<li><div class='formSection_"+count+"'> <label for='singleLineText_"+count+"'>Single Line Text </label><input type='text' value='' name='singleLineText_"+count+"' id='singleLineText_"+count+"' /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 
 
    $('#rohit').append(slt); 
 

 
};

#singleTextbtn { 
 
    border: solid 1px red; 
 
    padding: 5px 10px; 
 
    float: left; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
 
<a href="#" id="singleTextbtn">click to add </a> 
 

 

 
<ul id="rohit"></ul>

Answer 2

Вы правы в своем коде, но вы должны изменить только эту строку ..

var slt =count+"count+<li><div class='formSection"+count+"'> <label for='singleLineText_"+count+"'>Single Line Text </label><input type='text' value='' name='singleLineText_"+count+"' id='singleLineText_"+count+"' /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 

Good Luck [ '}

Answer 3

Я надеюсь, что у меня есть ты ...

Я думаю, что вы избежали ошибочного «счета»:

Here является рабочей скрипкой.

В основном вы должны избежать «подсчет» во всех ваших имен классов и так далее:

например <div class='formSection"+count+"'>

Answer 4

Вы должны закрыть строку и добавить ее с помощью знака +:

function singleLineText() { 
     count++; 
     var slt = count + "count+<li><div class='formSection'"+count+"> <label for='singleLineText_'"+count+">Single Line Text </label><input type='text' value='' name='singleLineText_'"+count+" id='singleLineText_'"+count+" /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 
     $('#rohit').append(slt); 
}; 

Answer 5

Просто убедитесь, что ваша строка правильно сформирована. Чтобы использовать переменную в вашей строке, у вас есть 2 варианта.

var myString = "count: "+count+" using double quotes" 

var myString2 = 'count: '+count+' using single quotes' 

Answer 6

Обновите html следующим образом.

var slt = count + "count+<li><div class='formSection'+count> <label for='singleLineText_'+count>Single Line Text </label><input type='text' value='' name='singleLineText_"+count+" id='singleLineText_"+count+" /><div class='actionSec'> <span class='addBtn' title='click here to add more'></span><span class='removeBtn' title='click here to remove'></span></div> </div> </li>"; 

Вот это plunker