Javascript 有没有一种方法可以让代码循环的一部分，而不是另一部分？（p5）

我正在尝试创建一个设置屏幕，您可以在其中更改名称和屏幕颜色，但为了使输入框可编辑，我必须运行noLoop（），这使得我为更改颜色而创建的函数不会运行。有没有办法只循环方法的一部分而不循环另一部分

var screen1;
var settingsScreen;

function setup()
{
createCanvas(650, 500);
  bgcolor = [102, 223, 211];
  background(bgcolor);
  enterName = createInput();
  nameButton = createButton('Enter');
  var name = enterName.value();
  settingsName = createInput();
  declareBooleans();
}

function draw() 
{
  if (screen1 == true)
  {
    drawScreen1();
  }
  else if (settingsScreen == true)
  {
    drawSettingsScreen();
  }
}

declare booleans()
{
screen1 = true;
settingsScreen = false;
}

function drawScreen1()
{
  textSize(80);
  fill(255);
  text("What's Your \n    Name?", 120, 200);
  enterName.position(213, 350);
  enterName.size(170, 30);
  enterName.style('font-size', '21px');
  nameButton.position(enterName.x + enterName.width, 350);
  nameButton.size(70, 36);
  nameButton.style('font-size', '21px');
  nameButton.mousePressed(screen1MousePressed);
}

function drawSettingsScreen()
{
  textAlign(LEFT);
  fill(255);
  enterName.remove();
  nameButton.remove();
  background(bgcolor);
  var name = correctName.value();
  settingsName.value(name);
  textSize(70);
  text("Settings", 207, 110);
  textSize(30);
  text("Name:", 20, 190);
  settingsName.position(120, 150);
  settingsName.size(150, 50);
  settingsName.style('font-size', '26px');
  text("Background Color:", 20, 350);
  fill(240, 108, 108);
  strokeWeight(2);
  rect(30, 370, 85, 85);
  fill(255, 194, 89);
  rect(130, 370, 85, 85);
  fill(249, 239, 98);
  rect(230, 370, 85, 85);
  fill(30, 219, 137);
  rect(330, 370, 85, 85);
  fill(102, 223, 211);
  rect(430, 370, 85, 85);
  fill(200, 157, 209);
  rect(530, 370, 85, 85);
  if (mouseIsPressed && mouseX >= 30 && mouseX <= 115 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [240, 108, 108];
  }
  else if (mouseIsPressed && mouseX >= 130 && mouseX <= 215 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [255, 194, 89]
  }
  else if (mouseIsPressed && mouseX >= 230 && mouseX <= 315 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [249, 239, 98];
  }
  else if (mouseIsPressed && mouseX >= 330 && mouseX <= 415 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [30, 219, 137];
  }
  else if (mouseIsPressed && mouseX >= 430 && mouseX <= 515 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [102, 223, 211];
  }
  else if (mouseIsPressed && mouseX >= 530 && mouseX <= 615 && mouseY >= 370 && mouseY <= 455)
  {
    loop();
    bgcolor = [200, 157, 209];
  }

var屏幕1；
var设置屏幕；
函数设置（）
{
createCanvas（650500）；
bgcolor=[102223211]；
背景色；
enterName=createInput（）；
nameButton=createButton（'Enter'）；
var name=enterName.value（）；
settingsName=createInput（）；
declareBooleans（）；
}
函数绘图（）
{
如果（屏幕1==true）
{
屏风1（）；
}
else if（设置屏幕==true）
{
绘图设置屏幕（）；
}
}
声明布尔值（）
{
屏幕1=真；
设置屏幕=假；
}
函数drawScreen1（）
{
文本大小（80）；
填充（255）；
文本（“您叫什么名字？”，120200）；
企业名称.职位（213350）；
enterName.size（170,30）；
style（'font-size'，'21px'）；
名称按钮位置（enterName.x+enterName.width，350）；
名称按钮。大小（70，36）；
nameButton.style（'font-size'，'21px'）；
名称按钮。按下鼠标（按下屏幕1鼠标）；
}
函数drawSettingsScreen（）
{
文本对齐（左）；
填充（255）；
enterName.remove（）；
nameButton.remove（）；
背景色；
var name=correctName.value（）；
设置名称值（名称）；
文本大小（70）；
文本（“设置”，207、110）；
文本大小（30）；
文本（“名称：”，20，190）；
设置名称位置（120150）；
设置名称大小（150，50）；
设置名称样式（'font-size'，'26px'）；
文本（“背景色：”，20350）；
填充（240、108、108）；
冲程重量（2）；
rect（30,370,85,85）；
填充（255、194、89）；
rect（13037085,85）；
填充（249239、98）；
rect（230、370、85、85）；
填充（30、219、137）；
rect（330、370、85、85）；
填充（102223211）；
rect（43037085,85）；
填充（200157209）；
rect（53037085,85）；
如果（mouseIsPressed&&mouseX>=30&&mouseX=370&&mouseX=370&&mouseX=230&&mouseX=370&&mouseX=330&&mouseX=370&&mouseX=430&&mouseX=370&&mouseX=370&&mouseX=370&&mouseX=370&&mouseY您可以使用另一个
if（）
围绕您的循环，并设置一些布尔值，这些布尔值只有在您希望此循环运行时才为真。
如果（settingsScreen）{noLoop（）；}

noLoop（）

是内置的P5.js函数，您可以执行类似的操作。