javascript - Javascript で 2 つの要素がクリックされ、テキスト ボックスに値が入力されたかどうかを確認する

Question

これが私が話していることのデモです - http://jsfiddle.net/MatthewKosloski/qLpT9/

「Foo」がクリックされ、入力に数値が入力された場合にコードを実行したい..そして「送信」がクリックされた場合。

<h1>Foo</h1>

<input type="text" id="amount" placeholder="Enter in a number."/>
<button id="send">Send</button>

私はこれを考えすぎていると確信しています。このような簡潔な質問について助けていただければ幸いです。

Answer 1

自己完結型のより良い例:

http://jsfiddle.net/qLpT9/7/

(function()
{
    var clicked = false;

    var header = document.getElementById("header");
    var amount = document.getElementById("amount");
    var send = document.getElementById("send");

    header.addEventListener("click", function()
    {
        clicked = true;
    });

    send.addEventListener("click", function()
    {
        if(!clicked)
        {
            return
        }

        // Foo has been clicked

        var value = amount.value;

        console.log(value;)
    });

})();

Answer 2

これを試してください：jfiddleリンク

var send = document.getElementById("send");
var h1 = document.getElementsByTagName("h1");

var foo_clicked = 0;

h1[0].onclick = function(){foo_clicked += 1; };

send.onclick = function(){
    if(document.getElementById("amount").value !='' && foo_clicked >0 )
    alert ('poor rating');

};

Answer 3

あなたの声明といくつかの仮定に従って、この方法を試してください：

(これは関数を 2 回実行します - テキストの変更またはボタンのクリックがあるとき)。

HTML:

<h1 id="">Foo</h1>

<input type="text" id="amount" placeholder="Enter in a number."/>

<button id="sendBtn">send</button>

JS:

document.getElementById("amount").addEventListener("change",poorRatingCalculation);
document.getElementById("sendBtn").addEventListener("click",poorRatingCalculation);

function poorRatingCalculation() {

    var rating = document.getElementById("amount").value;

    if(rating=="poor")  alert("Poor Service");
}

デモ: http://jsfiddle.net/wTqEv/

Answer 4

これはあなたが探していたものですか？

http://jsfiddle.net/qLpT9/5/

function poorRatingCalculation(){
        if(myInput.value) {
            alert(myInput.value);
        }
 }

        var foo = document.getElementById("foo"),
            myInput = document.getElementById("amount");

  foo.addEventListener("click", poorRatingCalculation, false)