无法更新 Javascript 对象文本中的值，然后更新页面

unable to update value within a Javascript object literal, and then update the page

本文关键字：更新 然后 Javascript 对象 文本      更新时间：2023-09-26

我在这里尝试了大约 10 个其他问题的答案，但似乎没有任何效果。我已经尝试了每一个，映射和grep。

我想更改对象文本中的值，然后更新我的列表。

这是数组：

goals = [
  {
    goalguid: "691473a7-acad-458e-bb27-96bac224205b",
    category: "personal",
    datecreated: "2013-10-20",
    startdate: "2013-10-28",
    enddate: "2013-11-26",
    goal: "go to store",
    icon: "cart",
    status: "completed",
    username: "jtmagee",
    userguid: "0c7270bd-38e8-4db2-ae92-244de019c543"
  }, {
    goalguid: "9e693231-e6d8-4ca9-b5c8-81ea7a80a36a",
    category: "personal",
    datecreated: "2013-10-20",
    startdate: "2013-10-27",
    enddate: "2013-11-27",
    goal: "Brush Teeth",
    icon: "doctor",
    status: "inprogress",
    username: "jtmagee",
    userguid: "0c7270bd-38e8-4db2-ae92-244de019c543"
  }, {
    goalguid: "8d23005d-f6f3-4589-bb85-a90510bccc21",
    category: "work",
    datecreated: "2013-10-20",
    startdate: "2013-10-26",
    enddate: "2013-11-28",
    goal: "Arrive on Time",
    icon: "alarm",
    status: "inprogress",
    username: "jtmagee",
    userguid: "0c7270bd-38e8-4db2-ae92-244de019c543"
  }, {
    goalguid: "ac879673-19eb-43f6-8b95-078d84552da0",
    category: "school",
    datecreated: "2013-10-20",
    startdate: "2013-10-24",
    enddate: "2013-11-29",
    goal: "Do Math Homework",
    icon: "book",
    status: "missed",
    username: "jtmagee",
    userguid: "0c7270bd-38e8-4db2-ae92-244de019c543"
  }
];

我正在抠掉从用户点击的 li 中获得的 goalguid。我使用状态键在 li 上更改类。

这是我的jQuery，它捕获了复选框的点击：

$(".goals").delegate("input[type=checkbox]", "click", function() {
  goalguid = $(this).parent().parent().data("goalguid");
  emailGoal = $(this).parent().data('goal');
  if ($(this).prop("checked")) {
    $(this).parent().parent().removeClass("inprogress missed").addClass("completed").prop("checked", true);
    updateStatus = 'completed';
    return updateTheGoal();
  } else {
    $(this).parent().parent().removeClass("completed").addClass("inprogress").prop("checked", false);
    updateStatus = 'inprogress';
    return updateTheGoal();
  }
});

这是我无法上班的地方。一些尝试完全清除了阵列，但大多数尝试（包括这个）除了让我的列表闪烁之外什么都不做。displayGoalList 函数适用于其他用途。

updateTheGoal = function() {
  var goalList;
  $.each(goals, function() {
    if (goals.goalguid === goalguid) {
      return goals.status === updateStatus;
    }
  });
  goals = JSON.parse(localStorage["goals"]);
  goalList = $.grep(goals, function(e) {
    return e.userguid === userguid;
  });
  localStorage.setItem(userguid + "Goals", JSON.stringify(goalList));
  logSummary();
  return displayMyGoalList();
};

任何帮助都非常感谢。谢谢。

$.each(goals, function() {
    if (goals.goalguid === goalguid) {
      return goals.status === updateStatus;
    }
});

您正在检查goals.goalguid并设置goals.status。 这是错误的。 goals是一个数组。 您的目的是检查数组中的每个元素。 那么你实际上并没有对你的回报做任何事情。 each 中的return只是中断循环或继续循环（取决于返回值）。 我想你的意思是分配它。 试试这个：

$.each(goals, function(i, el) {
    if (el.goalguid === goalguid) {
        el.status = updateStatus;
        return false; // break the each
    }
});

此外，删除此位，该位将用存储在本地存储中的任何内容替换each所做的任何更改：

goals = JSON.parse(localStorage["goals"]);
相关文章：