フィールドが満杯になるまでボタンを無効にするJS

Question

フォームフィールドが塗りつぶされるまでボタンを無効にしておくと、これを達成できないようです。私は単一のフィールドで小さな例を作成しましたが、原則はより大きなフォームで同じになります。

誰でも手助けできますか？

コード：

function checkForm() { 
 
    var name = document.getElementById("name").value; 
 
    var cansubmit = true; 
 

 
    if (name.value.length == 0) { 
 
    cansubmit = false; 
 
    } 
 

 
    if (cansubmit == false) { 
 
    document.getElementById("submitbutton").disabled = true; 
 
    } 
 

 
};

<input type="text" id="name" onkeyup="checkForm()" /> 
 

 
<button type="button" id="myButton">Test me</button>

Answer 1

あなたのサンプル中のミスのカップルがあります：

1. var nameは、その後、あなたがチェックし、name要素の値の文字列に割り当てられていますそのvalueのプロパティ - 文字列にはvalueプロパティがありません。
2. サブミットボタンのidはmyButtonですので、idで取得するにはidを使用してください（disabled属性を設定する場合）。
3. は、名前入力の長さまで、サブミットボタンを無効にすることができ、最初は右、良いアイデアのように聞こえる0

より大きく、ボタンを無効にしますか？ - 例えば

function checkForm() 
 
{ 
 
    var name = document.getElementById("name").value; 
 
    var cansubmit = (name.length > 0); 
 
    document.getElementById("myButton").disabled = !cansubmit; 
 

 
};

<input type="text" id="name" onkeyup="checkForm()" /> 
 

 
<button type="button" id="myButton" disabled="disabled">Test me</button>

あなたはまた、キー入力以外の方法を経由して変更を扱う検討する必要があります：

参照は、以下の例を修正しましたマウスアップなど... onchange="checkForm()"を追加しようとしましたが、ぼかし（フォーカス変更）のみで動作します...