0

私はフォームをいじっていて、JSfiddle を使っていましたが、ページからアラートを返すことができませんでした。

ここに私のHTMLがあります：

<form>
<input type="text" id="first"></input>
<input type="text" id="last"></input>
<input type="button" value="Submit" onClick="construct()"></input>
</form>

ここに私のJavaScriptがあります:

function construct() {
var firstName = document.getElementById("first").value;
var lastName = document.getElementById("last").value;
alert("Welcome to the party " + firstName + " " + lastName + "!");
}

そして、なぜ値が返されないのかわかりません。どんな助けでも大歓迎です！ああ、ここにフィドルがあります: http://jsfiddle.net/nickpalmer789/4DJ4e/1/ ありがとう!

4

3 に答える 3

1

フィドルは onload を実行するように設定されているため、関数はグローバル スコープでは使用できません。頭または体で実行するように変更します

ここに画像の説明を入力

または邪魔にならない方法でイベント ハンドラーをアタッチします。 

document.getElementsByTagName("button")[0].onclick = construct;
于 2013-11-08T14:44:33.967 に答える
0

onload(左上) をに変更する必要がありますno wrap - in <head>。スコープに干渉しているため、(属性が探している)construct()グローバル スコープで宣言されていません。onclick

それ以外の場合は、次のように宣言しますwindow.construct = function(){ ... }

余談ですが、マークアップと JavaScript を分離しておく必要があります。つまりon*、要素の属性を使用せず、代わりに JavaScript 内でそれらにバインドします。何かのようなもの：

<!-- give n ID to the button -->
<input type="submit" value="Submit" id="submit-btn" />

<script>
  // grab the button (using the ID)
  var submitBtn = document.getElementById('submit-btn');
  // attach en event handler for click
  submitBtn.addEventListener('click', function(){
    // construct() code goes here
  });
</script>
于 2013-11-08T14:44:25.000 に答える
0

constructは別の関数内で定義されているため、グローバルではなく、固有のイベント属性にアクセスできません。

固有のイベント属性を使用せず、イベント ハンドラーを JS にバインドします。

document.querySelector('input[type="button"]').addEventListener('click', construct);

そのような：http://jsfiddle.net/4DJ4e/3/

于 2013-11-08T14:44:52.863 に答える