首页 > 解决方案 > jquery函数转换成另一个函数不返回所有结果

问题描述

我有一个触发另一个函数的 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();

标签: jqueryfunctionappend

解决方案


每次调用 numbers 时,它都会覆盖 res,并且 append 会获取 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 变量范围。


推荐阅读