Question

我有两个输入字段，我正在尝试通过单击按钮使用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>

如果我没有指定值，则两个变量的alert都返回undefined。如果我更改输入的值并单击按钮，它仍然会显示test1和test2。我必须在这里找到一些简单的东西，任何人都知道它是什么？

Answer 1

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

尝试：

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

Answer 2

name1 = $("#name").val()

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

http://jsfiddle.net/wTvku/

Answer 3

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

document.getElementById('submitButton').onclick = function() {
    var name1 = document.getElementById('name').value,
        line1 = document.getElementById('line').value;
    alert("Name: " + name1 + "\nMessage: " + line1);
};

Answer 4

你应该将你的代码包装在document.ready（）event ...

中

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

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

// Handler for .ready() called.
});

Answer 5

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

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

消息：
提交

$（ “＃提交按钮”）。点击（函数（）{ name1 = $（“＃name”）。val（）; line1 = $（“＃line”）。val（）; alert（“Name：”+ name1 +“\ nMessage：”+ line1）; }）;

.val（）没有从输入获取更新值

5 个答案: