将范围控件放入表单（javascript）后，它们不再工作

我编写了一个简单的js代码来显示范围输入值：

output.innerHTML = slider.value;

function settings3_newDistance() {
    var slider = document.getElementById(
    "settings3_newDistance"
    ).value;
    document.getElementById(
    "settings3_newDistance_value"
     ).value = slider;
}

当

input type=“range”

不在表单中时，它可以完美地工作。当我把所有东西都包装成一个表格后，它突然停止了工作。我试图将提交按钮更改为

<button type="button" class="btn btn-primary">Submit</button>

现在，代码构成表单的底部：

<div class="col-lg-12">
  <button type="reset" class="btn btn-default">
    Reset
  </button>
  <button type="button" class="btn btn-primary">
    Submit
  </button>
 </div>

重置
提交

这不是函数声明。。。这就是事件侦听器分配。显示的代码不足，无法确定您的问题。您认为禁用表单提交会有帮助吗？发生了一件事，javascript无法再将输出写入我正在使用的只读文本输入。我同意StackSlave的观点——代码太少，无法确定任何内容。请发布更多的代码。现在我已经包含了更多与此问题相关的代码。请看一下。这不是函数声明。。。这就是事件侦听器分配。显示的代码不足，无法确定您的问题。您认为禁用表单提交会有帮助吗？发生了一件事，javascript无法再将输出写入我正在使用的只读文本输入。我同意StackSlave的观点——代码太少，无法确定任何内容。请发布更多的代码。现在我已经包含了更多与此问题相关的代码。请看一看。

<div class="col-lg-12">
  <button type="reset" class="btn btn-default">
    Reset
  </button>
  <button type="button" class="btn btn-primary">
    Submit
  </button>
 </div>