如何在不调用参数的情况下传递带有参数的函数

时间:2020-09-01 22:33:00

标签: javascript function button parameters onclick

我到处都看过,似乎找不到答案,或者至少我只能以非常有限的技能水平理解一个答案(我实际上是通过练习和Google来教自己html,css和js) 。我正在尝试将document.getElementById("button").onclick = buttonfunc;作为参数的一部分使用buttonfunc。我已经能够使用相当于Buttons(MyFunction);的东西来足够容易地调用此函数,因为如果我将Buttons(MyFunction());这样的括号放入,我的理解是它将参数视为MyFunction()的值,即使它是一个void函数。问题是我无法通过函数传递参数,这意味着我必须为要执行按钮的每个新操作创建一个新函数,如果可以的话,我想避免这样做,因为可能会很平凡或类似功能。有没有一种方法可以通过函数传递参数,这样我就不必每隔一分钟就换一个新参数?预先感谢!

以下是该功能的完整代码及其使用示例(我正在用8个按钮进行文字冒险)。

function Buttons(b1, b2, b3, b4, b5, b6, b7, b8, b1func, b2func, b3func, b4func, b5func, b6func, b7func, b8func) {
    if (b1func == 0) {
        document.getElementById("b1").disabled = true;
        document.getElementById("b1").innerHTML = "";
    }
    else {
        document.getElementById("b1").disabled = false;
        document.getElementById("b1").innerHTML = b1;
        document.getElementById("b1").onclick = b1func;
    }
    if (b2func == 0) {
        document.getElementById("b2").disabled = true;
        document.getElementById("b2").innerHTML = "";
    }
    else {
        document.getElementById("b2").disabled = false;
        document.getElementById("b2").innerHTML = b2;
        document.getElementById("b2").onclick = b2func;
    }
    if (b3func == 0) {
        document.getElementById("b3").disabled = true;
        document.getElementById("b3").innerHTML = "";
    }
    else {
        document.getElementById("b3").disabled = false;
        document.getElementById("b3").innerHTML = b3;
        document.getElementById("b3").onclick = b3func;
    }
    if (b4func == 0) {
        document.getElementById("b4").disabled = true;
        document.getElementById("b4").innerHTML = "";
    }
    else {
        document.getElementById("b4").disabled = false;
        document.getElementById("b4").innerHTML = b4;
        document.getElementById("b4").onclick = b4func;
    }
    if (b5func == 0) {
        document.getElementById("b5").disabled = true;
        document.getElementById("b5").innerHTML = "";
    }
    else {
        document.getElementById("b5").disabled = false;
        document.getElementById("b5").innerHTML = b5;
        document.getElementById("b5").onclick = b5func;
    }
    if (b6func == 0) {
        document.getElementById("b6").disabled = true;
        document.getElementById("b6").innerHTML = "";
    }
    else {
        document.getElementById("b6").disabled = false;
        document.getElementById("b6").innerHTML = b6;
        document.getElementById("b6").onclick = b6func;
    }
    if (b7func == 0) {
        document.getElementById("b7").disabled = true;
        document.getElementById("b7").innerHTML = "";
    }
    else {
        document.getElementById("b7").disabled = false;
        document.getElementById("b7").innerHTML = b7;
        document.getElementById("b7").onclick = b7func;
    }
    if (b8func == 0) {
        document.getElementById("b8").disabled = true;
        document.getElementById("b8").innerHTML = "";
    }
    else {
        document.getElementById("b8").disabled = false;
        document.getElementById("b8").innerHTML = b8;
        document.getElementById("b8").onclick = b8func;
    }
}

Buttons("Male", "Female", "Neutral (it pronouns)", "Neutral (they pronouns)", "", "", "", "", He, She, It, They, 0, 0, 0, 0);

Buttons(
        "Citizen<span class=\"tooltip\">You are the winner of an essay-writing contest, earning a funded trip to the cosmos on the condition you keep a journal of your experience to be published at the conclusion of your journey. You will start at iDune, the Intragalactic Diplomatic post of the United Nations of Earth.</span>",
        "Diplomat<span class=\"tooltip\">You are a diplomat sent to Armistice, a city-planet and the political hub of the galaxy. You are representing the United Nations of Earth, playing a very minor role in increasing the human population at Armistice and creating positive first impressions among its citizens.</span>",
        "Explorer<span class=\"tooltip\">You are an opportunist, ready to explore planetary systems that have yet to be mapped, and hopefully find valuable resources or phenomena to be claimed, patented, or profited from. You will start at Tenkets, a commercial hub and massive market satellite established by the shelish.</span>",
        "Merchant<span class=\"tooltip\">You are a vendor of goods from Earth, ready to spread new commodities to the alien races for a price. What goods you sell, and their legality, is up to you. You will start in Menagerie, a cultural hub planet and allegedly the most diverse place in the galaxy.</span>",
        "Spacer<span class=\"tooltip\">You are a member of the United Nations of Earth's Interstellar Defense Force, the servicemen and women of which are known as \"spacers\". You are currently on a survey ship, working with a small squad to protect its crew as they investigate UNE interests.</span>",
        "Stowaway<span class=\"tooltip\">You are a criminal stowed away on a ship leaving Earth. You have little to your name and no idea where the ship you are in is headed, nor do you know whether you will be able to safely disembark without getting caught.</span>",
        "", "", Citizen, Diplomat, Explorer, Merchant, Spacer, Stowaway, 0, 0);

Buttons("Yes<span class=\"tooltip\">Continue with the selected start.</span>", "No<span class=\"tooltip\">Restart character creation.</span>", "", "", "", "", "", "", Start, CharacterCreation, 0, 0, 0, 0, 0, 0);

1 个答案:

答案 0 :(得分:0)

使用.bind方法。

const myFunctionWithParameters = myFunction.bind(null, myParameter, myOtherParameter);

myFunctionWithParameters();
// the above line is equivalent to the below line (unless myFunction uses the this variable)
myFunction(myParameter, myOtherParameter);

例如:

const sayHello = console.log.bind(null, 'hello');

sayHello();

// this is the same as:

console.log('hello');