Показать каждый символ строки при нажатии кнопки

Question

Я очень новичок в jQuery, и я пытаюсь отобразить букву строки при нажатии кнопки. Мне бы хотелось, чтобы каждый раз, когда нажимается кнопка, отображается значение «b», затем «ba», затем «bar», но прямо сейчас, когда нажимается кнопка, единственное, что отображается, это «b». Вот мой код - любая помощь будет принята с благодарностью!

$(".letter").on('click', function(event){ 

    var foo = "bar" 
    var split = foo.split(''); 
    $('.answer').val(split[0]); 
    split.splice(0,1); 


}); 

Answer 1

Это использование кода длина вывода вместо внутреннего счетчика

var foo = 'bar'; 
    $(".letter").on('click', function (event) { 
     $('.answer').val(foo.substring(0,$('.answer').val().length +1)); 
    }); 

Answer 2

DEMO

Это имеет мало общего с JQuery. Вам просто нужно немного больше JavaScript - вам нужно сохранить текущий индекс где-то, и увеличить его в обработчике

var index = -1; 
$(".letter").on('click', function(event){ 
    var foo = "bar" 

    if (index == foo.length - 1) return; 
    $('.answer').val($('.answer').val() + foo.charAt(++index)); 
}); 

Answer 3

Установить счетчик! Каждый раз, когда вы нажимаете, он отображает подстрочную версию!

var count = 1; 
$(".letter").on('click', function(event){ 
    var foo = "bar"; 
    if (count < foo.length) { //set an if so that it stops incrementing 
     var split = foo.substr(0,count); 
     $('.answer').val(split); 
     count++; 
    } else { 
     $(".answer").val(foo); 
    } 
}); 

Answer 4

Вы можете сделать Foo и разделить глобальные и вы сделали: D

var foo = "bar" 
var split = foo.split(''); 

$(".letter").on('click', function(event){ 

    alert(split[0]); 
    split.splice(0,1); 


}); 

Рабочий пример: jsfiddle

Answer 5

Почему даже разбить его, просто сделать подстроку с встречным идеей

Установите счетчик!

var count = 2; 
    $(".letter").on('click', function(event){ 
     var foo = "bar" 
     $('.answer').val(foo.substring(1,count)); 
     count++ 
    });