Can I pass the name of a class to a Javascript function?

Question

I have a line that calls a javascript function to work with a class, like this:

<a href="#" class="CarryOver" onclick="PerformCalc()"></a>

function PerformCalc() {

   const el = document.getElementById("input1");

   (and do work here)

}

If I know the name of a class in advance, can I pass the classname to the function as a variable?

For example:

<a href="#" class="CarryOver" onclick="PerformCalc(input1)"></a>

function PerformCalc(someclassname) {

   const el = document.getElementById(someclassname);

   (and do work here)

}

Answer 1

Hi @Coreysan

If I know the name of a class in advance, can I pass the classname to the function as a variable?

Since you are using the getElementById method, the parameter should be the element's id attribute, if you want to transfer the class name, in the function, you should use the getElementsByClassName method.

To transfer parameter (id or class name) to the JavaScript function, you could refer the following sample:

<div id="outerElement">
    <input type="text" name="myname1" class="dz_input1" id="input1" />

    <a href="#" class="CarryOver" onclick="PerformCalc('input1')">Click Me</a>
</div>

@section scripts {
    <script> 
        function PerformCalc(id) {
            event.preventDefault(); //prevent the hyperlink default navigate behavior.
            const el = document.getElementById(id); 
            alert(el.value);
        }
    </script>
}

The result as below:

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,

Dillion