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

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 2

设置一个计数器！每次单击，它都会显示子字符串版本！

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 3

你可以制作foo并拆分全局，你就完成了：D

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

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

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


});

工作示例：jsfiddle

Answer 4

为什么即使拆分它，只需用反制想法做一个子串

设置一个计数器！

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

Answer 5

此代码使用输出的长度而不是内部计数器

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

在按钮单击时显示字符串的每个字符

5 个答案: