javascript - 未在 Javascript 函数中获取 HTML 文本框值？已搜索，但没有找到令人信服的答案

Question

我是一个初学者，试图从文本框中获取要在 if/else 语句中使用的 HTML。这是我的 HTML 代码:

    <label id="label1">
    Enter any Number:
</label>
<input type="button" id="Button1"  value="button" />
    <input type="text" id="TextBox1" name="myname" />

我的 JavaScript 代码是:

    <script type="text/javascript">
//<![CDATA[
var buttonElement = document.getElementById("Button1");
var txt_value =document.getElementById("TextBox1").value;
buttonElement.addEventListener('click', function() { Clicked(txt_value) }, false);

function Clicked(txt_value) {

    if (txt_value == 7) {
        alert("You are 7");
    }
    else { alert("You are not 7"); }
}
//]]>
    </script>

我观察到

    var txt_value =document.getElementById("TextBox1");

然后

      buttonElement.addEventListener('click', function() { Clicked(txt_value.value) }, false);

上面的例子工作得很好。

有人可以告诉我出了什么问题吗:

    var txt_value =document.getElementById("TextBox1").value;

我不知道为什么我会得到一个空的 txt_value

Answer 1

原因是您在用户输入任何内容之前获取txt_value中的值；因此该值始终为空。

如果您将代码更改为:

var txt_value =document.getElementById("TextBox1");//removed .value

点击该函数:

function Clicked(txt_value) {

    if (txt_value.value == 7) { //added .value
        alert("You are 7");
    }
    else { alert("You are not 7"); }
}

应该可以。

这是一个jsfiddle