jquery函数转换成另一个函数不返回所有结果

Question

我有一个触发另一个函数的 jQuery 函数，但它总是返回最后一个结果。我的代码有什么问题？谢谢。

function numbers(a, b) {
  res = '<div>' + a + ',' + b + '</div>';
}

function bloc1() {
  numbers(1, 2);
  numbers(3, 4);
  numbers(5, 6);
  $("#bloc1").append(res);
  // ouput : 5,6
  // but I want : 1,2 3,4 5,6
}

function bloc2() {
  numbers(10, 20);
  numbers(30, 40);
  $("#bloc2").append(res);
  // ouput : 30,40
  // but I want : 10,20 30,40
}

function bloc3() {
  numbers(500, 600);
  numbers(700, 800);
  $("#bloc3").append(res);
  // ouput : 700,800
  // but I want : 500,600 700,800   
}

bloc1();
bloc2();
bloc3();

Answer 1

每次调用数字时，它都会覆盖 res 并且追加获取 res 的最新版本并将其打印到 html。

看看这个小提琴它应该回答你的问题： https://jsfiddle.net/q4bjso0n/5/

更改您的 numbers 函数，以便返回 res，而不仅仅是设置。

function numbers(a, b) {
  res = '<div>' + a + ',' + b + '</div>';
  return res;
}

或更好

function numbers(a, b) {
  return '<div>' + a + ',' + b + '</div>';
}

现在 numbers 函数每次调用时都会返回 res 的值。

您现在需要在变量中捕获函数编号的值并将该值附加到 html dom。

你可以用不同的方式解决这个问题，例如：

function bloc1() {
  //numbers(1, 2);
  //numbers(3, 4);
  //numbers(5, 6);
  $("#bloc1").append(""+numbers(1, 2)+numbers(3, 4)+numbers(5, 6));
  // ouput : 5,6
  // but I want : 1,2 3,4 5,6
}

或者像这样……

function bloc1() {
  a = numbers(1, 2);
  b = numbers(3, 4);
  c = numbers(5, 6);
  $("#bloc1").append( ""+a+b+c);
  // ouput : 5,6
  // but I want : 1,2 3,4 5,6
}

或者像这样：

function bloc1() {
  myres = ""+numbers(1, 2)+ numbers(3, 4)+ numbers(5, 6);
  $("#bloc1").append(myres);
  // ouput : 5,6
  // but I want : 1,2 3,4 5,6
}

“res”存在于函数编号中。您需要检查函数和 javascript 变量范围。