4

我有两个输入字段，我试图通过单击一个按钮使用 jquery 获取它们的值。这似乎是一个非常简单的操作，但对于我的生活，我无法让它工作。这是代码片段：

Name: <input type="text" id="name" value="test1"><br>
Message: <input type="text" id="line" value="test2"><br>
<button id="submitButton">Submit</button>

<script>
name1 = $("#name").val();
line1 = $("#line").val();

$("#submitButton").click(function(){
    alert("Name: " + name1 + "\nMessage: " + line1);
});

</script>

如果我没有指定该值，则警报会返回两个变量的未定义。如果我更改输入的值并单击按钮，它仍然显示 test1 和 test2。我必须在这里缺少一些简单的东西，有人知道它是什么吗？

4

5 回答 5

11

在您的代码中，您在脚本初始化时获取值，然后在 click 函数中引用它们在该点的值，而不是获取当前值。

尝试：

$("#submitButton").click(function(){
    name1 = $("#name").val();
    line1 = $("#line").val();
    alert("Name: " + name1 + "\nMessage: " + line1);
});
于 2013-03-06T00:20:36.150 回答
2 
name1 = $("#name").val()

创建一个新的字符串变量name1，其当前值为$("#name").val()。 .val()每次您尝试访问时都不会调用name1. 最简单的方法就是使用它$("#name").val()。

http://jsfiddle.net/wTvku/

于 2013-03-06T00:20:41.213 回答
2

正如其他答案中提到的，问题在于您正在预先计算变量并期望它们神奇地改变。但是我强烈建议使用Vanilla JS

document.getElementById('submitButton').onclick = function() {
    var name1 = document.getElementById('name').value,
        line1 = document.getElementById('line').value;
    alert("Name: " + name1 + "\nMessage: " + line1);
};
于 2013-03-06T00:22:27.010 回答
0

您应该将代码包装在 document.ready() 事件中...

$(document).ready(function() {  
name1 = $("#name").val();
line1 = $("#line").val();

$("#submitButton").click(function(){
    alert("Name: " + name1 + "\nMessage: " + line1);
});

// Handler for .ready() called.
});
于 2013-03-06T00:20:41.663 回答
0

您已经在 click 函数之外设置了变量值。该值是在页面加载时设置的，而不是在您运行该函数时设置的。尝试这个：

Name: <input type="text" id="name" value="test1"><br>

留言：
提交

$("#submitButton").click(function(){ name1 = $("#name").val(); line1 = $("#line").val(); alert("Name:" + name1 + "\n消息：" + line1); });
于 2013-03-06T00:21:20.460 回答