0

I am trying to print 2 strings. What is wrong here?

function alpha(name1, name2){
  console.log(name1, name2);
}
<button onclick=alpha("Peter", "Jack")>ok</button>
Deadpool
  • 7,811
  • 9
  • 44
  • 88
  • 4
    You need to quote the attribute with other quotes than the ones in the call. For example `onclick='alpha("Peter", "Jack")'` I would prefer the other way around: `onclick="alpha('Peter', 'Jack')"` – mplungjan Jun 04 '20 at 17:01
  • Thanks guys, I just don't like someone downvoting .... without telling answer! BTW ... thanks to all who helped out! – Deadpool Jun 04 '20 at 17:05
  • It's likely downvoted because it is really a typo-type question – mplungjan Jun 04 '20 at 17:05

5 Answers5

2

Others have already told you that the issue is that the value of your onclick needs to be quoted and those quotes should not conflict with the quotes you are already using around your function arguments, but I have a different approach for you....

You really shouldn't be using inline HTML event attributes (i.e. onclick) in the first place. This is a 25+ year old technique that just won't die because it's easy to understand and most new developers just copy someone else's code and convert it to their needs. There are many reasons why this old technique should just fade away and instead, you should use the modern API for event binding, which is .addEventListener().

In your case, it's not obvious why a button would have function arguments hard-coded into it, but if that really is your use case, those should be stored as data-* attributes.

Here's your scenario, reworked into code from this century:

// Get a reference to the DOM element you need to work with
let btn = document.querySelector("button");

// Get the data-* into an array
let people = btn.dataset.people.split(",");

// Do the event binding in JavaScript, not HTML
// We'll set the click event to invoke an anonymous
// function that itself calls the real function and
// passes the proper arguments.
btn.addEventListener("click", function(){
  alpha(people[0], people[1]);
});

function alpha(name1, name2){
  console.log(name1, name2);
}
<!-- Notice that the data is held in a data-* attribute and 
     that the code to hook up the event is gone from the HTML. -->
<button data-people="Peter,Jack">ok</button>
Scott Marcus
  • 64,069
  • 6
  • 49
  • 71
1

You are wrongly defining the handler of onclick.

function alpha(name1, name2){
  console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
cabesuon
  • 4,860
  • 2
  • 15
  • 24
0

You are missing a pair of quotes.

<button onclick="alpha('Peter', 'Jack')">ok</button>
axtck
  • 3,707
  • 2
  • 10
  • 26
0

You need quotation marks around the function in HTML

function alpha(name1, name2){
  console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
-2

Using Single quotes '' in the html instead of double will solve the issue. Also put quotes around the function

function alpha(name1, name2){
  console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
semperflynex
  • 43
  • 1
  • 5
  • Welcome to SO. Please read the comments to the question before answering as well as the other answers and their comments – mplungjan Jun 04 '20 at 17:07