How to call a function with arguments from an html string which is defined as a variable in another function?

I have a function defined like this:

function chat_add_user_message(message, url, option_position, vote_count) {
    var html = '<div">' +
        '<p class="message" onclick="cast_vote()">' +
            message +
        '</p>' +
    '</div>';
    $(".chatlogs").append(html);
};

Now what I want to do is call the function cast_vote whenever the message is clicked. Also I want to pass arguments to this function.

I have tried calling the cast_vote function without arguments in the above example code. Although I had this function defined like here:

function cast_vote() {
    console.log("Cast Vote");
};

I got an error:

Uncaught ReferenceError: cast_vote is not defined at HTMLParagraphElement.onclick

How do I call the cast_vote function with arguments from var html?

Sounds like your cast_vote is not on the top level. Functions referenced by inline handlers must be defined on the top level for them to be referenceable. For example, the following won't work:

$(() => {
  function doStuff() {
    console.log('doing stuff');
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div onclick="doStuff()">click me</div>

Functions, Technologies Overview � HTML � CSS � JavaScript � Graphics � HTTP � APIs / DOM � Browser The preceding statement calls the function with an argument of 5 . The arguments of a function are not limited to strings and numbers. Variables defined inside a function cannot be accessed from anywhere� The parameters, in a function call, are the function's arguments. JavaScript arguments are passed by value: The function only gets to know the values, not the argument's locations. If a function changes an argument's value, it does not change the parameter's original value. Changes to arguments are not visible (reflected) outside the function.

Inside your chatlog class, have this

<div id="foo" style="display:none">
    <p class="message" onclick="cast_vote()"></p>'
</div>

Have url, option_position, vote_count as global variables in js so that you don't need to pass them as params.

function chat_add_user_message(message, url, option_position, vote_count) {
    $(".message").text(message);
    $("#foo").css({"display": "block"});
    $(this).url = url;
    $(this).option_position = option_position;
    $(this).vote_count = vote_count;
}

Chapter 15. Functions, You can call a function by mentioning its name, followed by arguments in The value produced by a function expression can be assigned to a variable (as shown in the last example), passed as an argument to another function, and more. Because However, this way of defining a function is slow and keeps code in strings� There are two methods for doing this. One is directly calling function by variable name using bracket and parameters and the other is by using call_user_func () Function but in both method variable name is to be used.

You can define the click event handler from Javascript.

function chat_add_user_message(message, url, option_position, vote_count) {
    var div = $("<div>"); //Create <div> element
    var p = $("<p>"); //Create <p> element
    $(p).addClass("message") //Add message css class
        .text(message) //set the text inside the <p> element
        .appendTo(div); //append <p> to <div>

    //Define click event handler
    $(p).click(function(){
        cast_vote(message, url, option_position, vote_count);
    });

    //Append <div> to .chatlogs
    $(".chatlogs").append(div);
};

function cast_vote(message, url, option_position, vote_count) {
    console.log(message, url, option_position, vote_count);
};

chat_add_user_message("Hello World", "http://www.example.com", 0, 0);
chat_add_user_message("Hello World 2", "http://www.example.com", 1, 1);

JavaScript, Function Parameters are the names that are define in the function definition and real html >. < head >. < title >. Function Parameters and Arguments. </ title > Arguments Pass by Value: In a function call the parameters are called as arguments. If we change the value of variable inside function then it will affect outside� When you call a function, you include data (arguments) in the places where the function definition has parameters. Note that the arguments passed to the function must be listed in the same order as the parameters in the function definition. In the following function, two parameters are defined for the myTacos function:

JavaScript Function Parameters, Well organized and easy to understand Web building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, PHP, Python, Bootstrap, Java� @fotanus: if you call a function with the argptr and the called function uses the argptr at all, the only safe thing to do is call va_end() and then restart va_start(argptr, fmt); to reinitialize. Or you can use va_copy() if your system supports it (C99 and C11 require it; C89/90 did not).

JavaScript Functions, building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, A JavaScript function is executed when "something" invokes it (calls it). A JavaScript function is defined with the function keyword, followed by a name, Inside the function, the arguments (the parameters) behave as local variables. Thank you for the example, but that doesn't work in my case: the result variable isn't global, but is a variable within a procedure. So when I call the function with result.name, result isn't known – JasperTack Mar 10 '12 at 2:45

Call a function with an argument, Save Your Code. If you click the save button, your code will be saved, and you get an URL you can share with others. Save Cancel. By clicking the "Save" button � If you add *and **to argument names when defining a function, it becomes a variable-length argument, and you can specify any number of arguments when calling a function. By convention, the names *argsand **kwargsare often used, but as long as *and **are headed, there are no problems with other names. *args: Receive multiple arguments as a tuple

Comments
  • can you share your html?
  • @Shashishekhar Hasabnis what arguments you wanna pass to it?
  • @MaheerAli the arguments same for the function chat_add_user_message except for the first message argument
  • where do you define your function cast_vote, I can call it with no problem.