Javascript 基于选定值启用按钮

公平的警告我有超级强悍的代码。话虽如此，我从一开始就禁用了按钮，以减少提交表单时发生的人为错误。我需要在填充三个特定字段时启用它。但是，其中一个字段是html中显示秒表的标题标记。然后，jquery函数将该输出作为文本进行刮取，并将其存储到名为userInfo的对象中。当IDs task、source和output不为空/=00:00:00时，我希望启用我的提交按钮

我在不同的地方尝试了多个if语句来检查输入值的有效性。但是，对于最新的if语句，它在禁用默认值时启用按钮

<div class ='row'>
<div class="input-field col s6">
 <input type="text" id="task" class="autocomplete" placeholder ='Task' required>
<div class="input-field col s6">
<select id = 'source'>
<option value="" diasable selected></option>
      <option value="some source">source1</option>
      <option value="other source">source2</option>
      </select>
      <label>source1 or source2</label>
</div>
<h2 id = 'output'><b>0:00:00:00</b></h2>
<button id="start"class="waves-effect waves-light btn">start<i class="material-icons right">timer</i></button>
<button id="stop"class="waves-effect waves-light btn">stop<i class="material-icons right">timer_off</i></button>
<button id ="btn" class="btn waves-effect waves-light #26a69a" type="submit" name="action" disabled>Track It!
<i class="material-icons right">access_time</i>
</button>

---

尝试使用更改事件侦听器，并测试在每次更改时是否应启用或禁用按钮

文件修改、验证； //我需要任务、源的输出和输出的文本值不为空/00:00:00才能启用按钮。 功能验证{ const ready=$task.val&&$source.val&&$output.text！==00:00:00； $btn.propdisabled，！ready； }

---

通读一遍，我相信您希望根据selectsource的值将buttonbtn的disabled属性更改为enabled。您可以使用下面的示例代码来实现这一点

// 1st: get select#source and button#btn using their ID
var source = document.getElementById('source');
var button= document.getElementById('btn');

// 2nd : capture source value on change using JS Event Listener
source.addEventListener("change", function() {
  if(source.value == "some source") {
    // 3rd : remove disabled attribute and set enabled attribute
    button.removeAttribute("disabled");
    button.setAttribute("enabled", "");
  }
});

---

为什么不使用btn的点击事件来验证所有三个标准，并在满足条件时提交？这对第一次提交有效，但对下一次提交保持启用按钮。你对如何在提交后禁用它有什么想法，这样用户就必须为相应的字段提供有效的输入吗？@SamuelDaly将它放入你的提交成功处理程序中，如果你有这样的想法的话。假设您需要验证服务器端的成功，您需要像google.script.run.withSuccessHandler=>{$btn.propdisabled，true；}.userClickeduserInfo；此示例显示了一个匿名函数，它在成功时禁用了按钮，您还可以传入一个执行许多操作的命名函数。？google.script.run.withSuccessHandleronSuccess；函数onSuccess{$btn.propdisabled，true；}.userClickeduserInfo；}@萨缪尔达利——不完全是。withSuccessHandler返回用于链接的运行对象。你不能在你的定义中把它连在一起。您需要google.script.run.withSuccessHandleronSuccess.userClickeduserInfo；并像往常一样在别处定义onSuccess no.userClicked在它的末尾

// 1st: get select#source and button#btn using their ID
var source = document.getElementById('source');
var button= document.getElementById('btn');

// 2nd : capture source value on change using JS Event Listener
source.addEventListener("change", function() {
  if(source.value == "some source") {
    // 3rd : remove disabled attribute and set enabled attribute
    button.removeAttribute("disabled");
    button.setAttribute("enabled", "");
  }
});