JavaScriptの変数にHTMLユーザー入力を保存する

Question

私はHTML/CSS/Javascriptで水をテストしています。私は3つの言語を（適度に）しっかりと把握していますが、それは私に問題を与えているお互いに協力するようにしているだけです。

私のCSSファイルとJavascriptファイルは、HTMLファイルに外部でリンクされています。

私は変数にユーザー入力を保存し、アラートウィンドウにテキストを表示するためにJavascriptを取得しようとしています。

function saveUn() { 
 
    var username = document.getElementById('un').value; 
 
    alert(username); 
 
}

<form> 
 
    Username: 
 
    <input type="text" size="12" id="un" /><br /> 
 
    <input type="submit" onclick="saveUn();" /> 
 
</form>

すべてのヘルプは大歓迎です！

更新：私の問題は、実際には、私は外部のJavascriptファイルを正しく挿入していないことが判明しました。私はそれを修正し、今私のコードは正常に動作します。タイプミスは生きている、子供たち。

Answer 1

は、あなたのコールバックreturnが偽みようとonclickハンドラにそれを渡す：

<form> 
    Username: 
    <input type="text" size="12" id="un" /><br /> 
    <input type="submit" onclick="return saveUn();" /> 
</form> 

function saveUn() { 
    var username = document.getElementById('un').value; 
    alert(username); 
    return false; 
} 

Answer 2

ここであなたを助けるかもしれないコードです。

 
 
    document.getElementById("clickHere").addEventListener("click", function(event){ 
 
    event.preventDefault() 
 
    var username = document.getElementById('un').value; 
 
    alert(username); 
 
});

<form > 
 
     Username: 
 
     <input type="text" size="12" id="un" /><br /> 
 
     <input type="submit" id="clickHere" /> 
 
    </form>

Answer 3

フォームを送信したいとちょうどalertを表示したくない場合は、この方法を試してください。

<form onSubmit = "return saveUn();"> 
    Username: 
    <input type="text" size="12" id="un" /><br /> 
    <input type="submit" /> 
</form> 
<script> 
function saveUn() { 
    var username = document.getElementById('un').value; 
    alert(username); 
    return false; 
} 
</script> 

Answer 4

をevent.preventDefault();

function saveUn(event) { 
 
    var username = document.getElementById('un').value; 
 
    alert(username); 
 
    event.preventDefault(); 
 
}

<form> 
 
    Username: 
 
    <input type="text" size="12" id="un" /><br /> 
 
    <input type="submit" onclick="saveUn(event);" /> 
 
</form>

てみてください

Answer 5

あなたのフォームを提出防ぐためには、preventDefaultを試してみてください

function saveUn() { 
 
    var username = document.getElementById('un').value; 
 
    alert(username); 
 
    return false; 
 
}

<form> 
 
    Username: 
 
    <input type="text" size="12" id="un" /><br /> 
 
    <input type="submit" onclick="return saveUn();" /> 
 
</form>