Calling a JavaScript function using string parameters

Lately, I've stumbled upon an issue when attempting to execute a function with multiple arguments.

<button type = "button" id = "clickmepls" onclick = killButton("clickmepls", "grave1")> Click me please </button>

The definition of the function is as follows: 

function killButton(buttonname, graveID){
   /* some code */
}

Upon running the script, I encounter the following error: https://i.sstatic.net/dWpvO.png

This error occurs whenever there are more than one argument in the function - the first one is displayed in the error message, and the arrow always points to what should come next.

What could be causing this issue?

javascriptfunctionargumentssyntax-error

Answer №1

You neglected to include quotation marks.

<button type = "button" id = "clickmepls" onclick = "killButton('clickmepls', 'grave1');"> Click me please </button>

Answer №2

It is important to remember that attribute values containing spaces need to be enclosed in quotes to prevent the space from prematurely ending the value within a JavaScript statement.

onclick="killButton('clickmepls', etc… "

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to remove text from a box when a user clicks on it?

After successfully placing G in the selected box upon clicking it, I now want to work on removing it when clicked again. I'm encountering an issue with my current code - can anyone help me identify what's wrong and suggest a solution? Below is ...

javascriptreactjsdebugging

Is anyone else experiencing issues with loading a font from a CDN? It works perfectly fine on Chrome Browser and Safari for iOS Simulator, but for some reason, it's not loading

It's driving me a bit crazy as I'm not sure where I've gone wrong. I'm currently working with NextJS and have loaded this font into my <Link />. While it displays perfectly on Chrome and Safari in the iOS simulator, it fails to l ...

javascripthtmlcssnext.js

Questions about setting up a local development environment for Angular.js

After completing a few tutorials on Angular.js, I was eager to start building projects from scratch locally. However, despite my efforts, I have not been able to successfully set up my local development environment. I tried copying the package.json from A ...

javascriptangularjsnode.js

Should the ListItem expand and collapse when clicked?

My react/material-ui component has the following structure: export const TodoItem: React.FC<Props> = ( {todo, itemKey}) => { const [dialogState, setDialogState] = React.useState<boolean>(false); const handleClose = () => { setDial ...

javascriptreactjsmaterial-ui

When the text in a Material UI Textfield is updated using setState in React, the Hinttext may overlap with the newly set

How can I fix the issue of default hintText and floatingLabelText overlapping with text in a textfield when using setState to autofill the textfield upon clicking on an edit button? Here is an image showing the textfield overlap: https://i.sstatic.net/8M ...

javascriptreactjsmaterial-ui

Issues arise when the Slick functionality fails to load following an ajax request

I've come across a situation similar to the one on this post. I'm having trouble getting my slick carousel to work after a successful ajax call. Despite trying all the solutions provided, it's still not functioning as expected. The code for ...

javascriptajaxslick.js

Are there any JavaScript charting tools that can draw in a clockwise direction with multiple data points?

Can anyone recommend a JavaScript live chart/graph library that can create clockwise graphs with multiple points, similar to the example below? https://i.sstatic.net/dQfK4.png ...

javascriptcharts

The AngularJS framework is failing to disable the autocomplete feature for the input field with a password type

I have attempted to disable auto-complete for the password input, but it doesn't seem to be working. Below is a sample of my code: <form name="testfrm" ng-submit="test(testfrm)" autocomplete="off"> <input type="password" id="passwor ...

javascriptjqueryhtmlcssangularjs

When quickly typing, the input formatting using a computed property in Vue.js is not getting applied

Is there a way to format data in the following manner: m:ss, while restricting the input textbox to display only 3 characters or fewer? (m = minute, s = seconds) The code snippet below successfully formats the data in m:ss format. However, when entering m ...

javascriptvue.jsvuejs2

The function jQuery[number] did not get executed

Hello, I have been researching this issue and have come across multiple solutions, but unfortunately none of them seem to work for me. I keep encountering the error message "jQuery21006460414978209883_1395689439888 was not called" when making an AJAX call ...

javascriptphpjqueryajaxjson

The issue with the Ajax infinite scrolling gallery is that it repeatedly displays the same images multiple times

I'm currently working on developing a straightforward gallery page that dynamically adds elements as you scroll to the bottom. To achieve this, I am using Django to render an HTML snippet from the backend and then utilizing JavaScript to append it to ...

javascriptjqueryhtmlajax

Continuously converting methods recursively until the array is fully processed

My current code has a method that is not very efficient and does not scale well. The object y is an array consisting of key/value pairs, each containing two properties: 1. A unique string property called name. This value is identified by the childre ...

javascripttypescript

Can anyone provide guidance on utilizing libraries within a Chrome extension?

I have been attempting to implement this for a total of 10 hours and I am struggling to make it work in script.js. // Creating a button element const button = document.createElement('button'); button.textContent = 'copy'; button.addEve ...

javascripthtmlgoogle-chromegoogle-chrome-extension

An error occurred while trying to initialize the ui.bootstrap.demo module in AngularJS

Currently, I am in the process of learning angularjs and have encountered a roadblock. An error keeps popping up: ncaught Error: [$injector:modulerr] Failed to instantiate module ui.bootstrap.demo due to: Error: [$injector:nomod] Module 'ui.bootstr ...

javascriptangularjs

What steps can I take to stop Highcharts from showing decimal intervals between x-axis ticks?

When the chart is displayed, I want to have tick marks only at integer points on the x-axis and not in between. However, no matter what settings I try, I can't seem to get rid of the in-between tick marks. Chart: new Highcharts.chart('<some i ...

javascripthighcharts

What is the best technique for creating a preloader that can seamlessly fill the background of a vector image?

I am looking for guidance on creating a CSS3 preloader using a vector image. My goal is to have the logo start off transparent with only the border visible, and as the loading occurs, fill in from bottom to top with the background color. Thank you to ever ...

javascriptjqueryhtmlcsscanvas

Trouble with implementing useEffect to assign value to TextField

I'm currently working on a project where I am using the useEffect hook to retrieve initial data from a database and set it as the initial value of a Material-UI TextField upon loading the page. Although this approach works most of the time, there are ...

javascriptreactjsaxiosmaterial-ui

Exploring and listing the key-value pairs from several arrays within an object

My inquiry pertains to the following function: function loadConfigurations(configs){ console.log(configs); } The 'configs' object received by the loadConfigurations function contains two properties --two arrays named "assigned" and "unassign ...

javascriptjqueryarraysjavascript-objects

Is there a way to define the route path when using MemoryRouter in Jest without using location or history objects?

Apologies if this question has already been asked before. I have a query regarding MemoryRouter in React. I am able to set initialEntries and initialIndex to customize "location" and "history", but the "match" parameter does not update as expected. It is ...

javascriptreactjsreact-routerjestjs

Choose a file in React by specifying its path instead of manually picking a file

Is there a way for me to automatically select a file from a specified path into my state variable without having to open a select file dialog? I'm looking for a solution where I can bypass the manual selection process. Any suggestions on how this can ...

javascriptreactjstypescript