Javascript 将参数传递给函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6638088/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript passing parameters to function
提问by K.R.
Rookie question: I have the following JavaScript functions. This works correctly but I don't want to hardcode the strings "Names" and "namesDiv". I want to pass them in as parameters to the getItems().How do I do this?
菜鸟问题：我有以下 JavaScript 函数。这工作正常，但我不想对字符串“Names”和“namesDiv”进行硬编码。我想将它们作为参数传递给 getItems()。我该怎么做？
Edit: The function GetMsg() returns a JSON object: result.
编辑：函数 GetMsg() 返回一个 JSON 对象：结果。
HTML:
HTML：
<input type="button" onclick="getItems(); return false;" value="Go"/>
JS:
JS：
function getItems() {
loadingMsg();
GetMsg("Names", null, callback);
}
function callback(result, args){
clearContainer();
//do stuff
document.getElementById("namesDiv").append(foo);
}
function loadingMsg(){
clearContainer();
// do stuff
document.getElementById("namesDiv").append(foo);
}
function clearContainer(){
document.getElementById("namesDiv").innerHTML = "";
}
回答by icktoofay
For half of them, it's obvious; you just start passing the parameters to the function:
对于其中一半来说，这是显而易见的；您只需开始将参数传递给函数：
function loadingMsg(containerID) {
clearContainer(containerID);
document.getElementById(itemDiv).append(foo);
}
function clearContainer(containerID) {
document.getElementById(containerID).innerHTML = "";
}
callbackis a little more complex. We'll turn it into a function returning the callback.
callback有点复杂。我们将把它变成一个返回回调的函数。
function makeCallback(containerID) {
function callback(result, args) {
clearContainer();
document.getElementById(containerID).append(foo);
}
return callback;
}
Now we can call makeCallbackto get a callback. We can now write getItems:
现在我们可以调用makeCallback以获取回调。我们现在可以写getItems：
function getItems(itemType, containerID) {
loadingMsg(containerID);
GetMsg(itemType, null, makeCallback(containerID));
}
回答by LoveAndCoding
You can simply:
您可以简单地：
HTML
HTML
<input type="button" onclick="getItems('Names', 'namesDiv'); return false;" value="Go"/>
JS
JS
function getItems(name, div) {
loadingMsg();
GetMsg(name, null, function(r, args) { callback(div, r, args); });
}
EDIT:I think I've covered everything...
编辑：我想我已经涵盖了一切......
回答by Pablo Fernandez
onclick="getItems('namesDiv', 'Names'); return false;"
and then:
进而：
function getItems(param1, param2) {
param1will be namesDivand param2will be Names
param1将会namesDiv并且param2将会是Names
This said, I'd recommend you take a look at Unobtrusive JavaScriptespecially the part that talks about separation of behavior from markup.
这就是说，我建议您查看Unobtrusive JavaScript，尤其是讨论将行为与标记分离的部分。
回答by Jim Deville
use addEventListenerinstead of inline onclick
使用addEventListener而不是内联onclick
<input type="button" id="getItems" value="Go" />
JS:
JS：
function getItems(name, id) {
loadingMsg(id);
GetMsg(name, null, callback(id));
}
function callback(id){
return (function() {
function(result, args){
clearContainer(id);
//do stuff
document.getElementById(id).append(foo);
}
})();
}
function loadingMsg(id){
clearContainer(id);
// do stuff
document.getElementById(id).append(foo);
}
function clearContainer(id){
document.getElementById(id).innerHTML = "";
}
document.addEventListener("DOMContentLoaded", function() {
document.getElementById("getItems").addEventListener("click", function() {
getItems("Names", "namesDiv");
}, false);
}, false);
