Javascript 为什么我的页面在触发函数后自行加载（我使用的是纯js）

我的函数运行得非常好，但我只看到了1秒的结果 然后页面会自行加载

我试过了

<button onclick="person.generate() return false">generate !</button>

//------生成烤肉-------------

类生成器{
生成（）{
对于（变量i=0；ireturn obj[keys[keys.length*Math.random（）您的表单假设该按钮是表单提交按钮，因此每当单击该按钮时，表单都会尝试将数据发送到您在
操作中指定的属性或页面本身（从而导致重新加载）如果未指定
操作
属性，或者
操作
属性没有值

只需将
type=“button”
添加到您的按钮元素，告诉表单您的按钮不是提交调用程序，只是一个普通按钮

tldr:添加上述属性
type=“button”
将阻止按钮单击尝试提交表单数据

<button type="button" onclick="person.generate()">generate !</button>

生成！
person.generate中有什么？表单中按钮的默认操作是提交表单，重载是服务器的响应。您正在发布表单。请尝试设置
type=“button”按钮上的
，和/或如果您不使用
元素，则只需完全删除该元素。删除控件周围标记的可能重复项。
class roastGenerator {

  generate(){
    for (var i = 0; i < selector.length; i++) {
      console.log("this is the " + i + " try" );
    if(lvlOfRoast.value == 1){
      if(selector.options[i].value == "cheap"){
      document.getElementById("generatedRoast").innerHTML = "it works!!" ;
      break;
    }else {
     console.log("pls choose cheap");

    }
}else{
  window.alert("pls choose 1");
  break;
}
}
};
  randomRoast(obj){
                var keys = Object.keys(obj)
                return obj[keys[ keys.length * Math.random() << 0]];
            };
} // close bracket for the class

var person = new roastGenerator();

<button type="button" onclick="person.generate()">generate !</button>