jQuery .readyは動作していません

Question

誰でもこのコードが機能しない理由を教えてもらえますか？私は入力があり、天気をチェックしようとしているか、入力が「開始」ではない。だから、私は...どのように何も働いていない - まだされていませんが、私は新しいので、私は問題が何であるか分かりません。

HTML

<form id="inputForm" onsubmit="return false;"> 
    <input id="input" type="text" size="30" autofocus="autofocus" maxlength="100" autocomplete="off"/> 
</form> 

JS：ここにコードを見た後

var input = ""; 

$(document).ready(function() { 
    $("#inputForm").submit(function() { 
    input = $("#input").val().toUpperCase(); 

    if (input === "START") { 
     alert("worked"); 
    } 

    $("#command_input").val(""); 
}) 
}); 

Answer 1

：https://jsfiddle.net/cu7tn64o/1/

を正常に動作するようです！他のコメンターが述べたように、あなたがそうのようなHTMLファイル内jQueryを含めていないので、これは可能性があります：

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script> 

https://code.jquery.com/

Answer 2

私はあなたがあなたのWebページでのjQueryを含めていないと思われます。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 

scriptタグの前にコードを追加してインポートできます。 （https://code.jquery.com/jqueryにはjQueryのCDNも多くあります）

実際にjQueryを実行する必要はありません。ここでは、プレーンJS同等のコードworking hereです：

var input = ""; 
document.body.onload = function() { 
    document.getElementById("inputForm").addEventListener("submit", function() { 
     input = document.getElementById("input").value.toUpperCase(); 
     if (input === "START") { 
      alert("worked"); 
     } 
     document.getElementById("command_input").value = ""; 
    }); 
}; 

Answer 3

1. まず、あなたのHTMLファイルにスクリプトタグを使用してjqueryのファイルが含まれています。

2. jqueryを使用してフォームを送信するか、以下のケースではボタンを使用して送信しました。入力フィールドから値が取り出され、比較されます。

var input = ""; 
 

 
$(document).ready(function() { 
 
    $("#inputForm").submit(function() { 
 
    input = $("#input-value").val().toUpperCase(); 
 

 
    if (input === "START") { 
 
     alert("worked"); 
 
    } 
 
    else 
 
    { 
 
    alert("sorry"); 
 
    } 
 

 
    $("#command_input").val(""); 
 
}) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="inputForm" onsubmit="return false;"> 
 
    <input id="input-value" type="text" size="30" autofocus="autofocus" maxlength="100" autocomplete="off"/> 
 
    <input type="submit" name="submit" value="submit" /> 
 
</form>

Answer 4

あなたは、イベントハンドラからfalseを返す場合は、物事は動作するはず。

var input = ""; 

$(document).ready(function() { 
    $("#inputForm").submit(function() { 
     input = $("#input-value").val().toUpperCase(); 

     if (input === "START") { 
      alert("worked"); 
     } else { 
      alert("sorry"); 
     } 

     $("#command_input").val(""); 

     // You have to return false HERE to prevent the default action of a      
     // form -- send a request to a server, that is 

     return false; 
    }); 
});