如何在页面加载时使提交按钮保持禁用

Question

好吧，我已经设法做了大部分我想用这个表单完成的工作，但是从拼图中遗漏了一件事。 我有一个下拉表单，需要您选择多个不同的选项。不过，我有一个选项，当页面加载时选择一个选项 - “选择一个选项 - ”，它在选择时禁用提交按钮，但当页面加载时不会禁用它，这是选项是自动选择的，如果有意义的话。 如何在页面加载时自动禁用提交按钮？

function selectChanged() { 
 
    attacks = document.getElementById("attacks"); 
 
    if (attacks.value == "not_valid") { 
 
    document.getElementById("sbattle").disabled = true; 
 
    } else { 
 
    document.getElementById("sbattle").disabled = false; 
 
    } 
 
}

<form> 
 
    <select name="attacks" id="attacks" value="Select" onchange="selectChanged()"> 
 
    <option value="not_valid">-- select an option --</option> 
 
    <option value="example1">example 1</option> 
 
    <option value="example2">example 2</option> 
 
    <option value="example3">example 3</option> 
 
    <option value="example4">example 4</option> 
 
    <option value="example5">example 5</option> 
 
    </select> 
 
    <br> 
 
    <input type="button" id="sbattle" onclick="sBattle()" value="Battle"> 
 
</form>

Answer 1

添加disabled到HTML

<input type="button" id="sbattle" onclick="sBattle()" value="Battle" disabled="disabled"> 

Answer 2

在你的页面加载事件呼叫selectChanged() ...或更好，但在DOM已准备就绪。

参见：https://jsfiddle.net/8eh1qcdb/