我试图从js函数中获取值并将其传递给另一个函数或使其成为全局变量。我有变量a3,我想从函数add()
中得到值,但它不起作用。
<!DOCTYPE html>
<html>
<head>
<title>Basic Web Page</title>
<script>
console.log('hello world!');
</script>
</head>
<body>
<form>
a: <input type="number" name="a" id="a"><br>
<button onclick="add()">Add</button>
<p id="greeting">Greetings</p>
</form>
<script src="java.js"></script>
</body>
</html>
function add() {
var a3 = document.getElementById('a').value;
return a3;
}
var a5 = add();
console.log(a5);
return false;
在您的情况下很重要,否则在执行add()
函数后,按钮的默认处理程序也将被执行,这将实际重新加载您的页面。您可以在这里找到一个工作示例:
function add() {
var a3 = document.getElementById('a').value;
console.log('a3='+a3);
return a3;
}
var a5 = add();
<form>
a: <input type="number" name="a" id="a" value="0"><br>
<button onclick="add(); return false;">Add</button>
<p id="greeting">Greetings</p>
</form>
你可以简单地写function add() { console.log(document.getElementById("a').value); }
只是为了补充另一个答案。当脚本加载时,您的代码正在运行。因此,var a5不是在运行add()
时设置的,而是立即设置的。从onclick运行add()
正在获取数据并返回它,但将其返回到任何地方。
这不是很清楚你想要实现什么,但是这里有一个方法可以创建一个全局变量,并且仍然将该值传递给函数。
// Cache all the elements up front
const a = document.querySelector('#a');
const greeting = document.querySelector('#greeting');
const btn = document.querySelector('button');
// Add a listener to the button - no need for inline JS
btn.addEventListener('click', handleClick, false);
// Global variable
let text = '';
function handleClick(e) {
// Prevent the form from submitting
e.preventDefault();
// Update text
text = `Greeting ${a.value}`;
// Call the `add` function with
// the input value
add(text);
}
function add(text) {
// Update the greeting
greeting.textContent = text;
}
<form>
a: <input type="number" name="a" id="a"><br>
<button>Add</button>
<p id="greeting"></p>
</form>