是否可以同时从两个调用函数中调用单个参数的同一个函数？

Question

I am developing an HTML5/JavaScript app.

I have a function named letter(x) it has a single parameter and I want to call it from two different places at a time. Is this possible?

I call it from an HTML where I have two image buttons with onclick functions. When I click the two image one by one it should pass and give a result

My code is below: Function code in JavaScript

function letter(x) {

    if (x==1&&a) {

        document.getElementById('audio2').play();
        document.getElementById('ka').style.visibility = "true"

    }
}

HTML code from which I call

<img src="images/mei/off/01.png" id="ik" onclick="letter(1);"/>

<img src="images/uyir/off/01.png" id="ah" onclick="letter(a);"/>

In the above when I tried to pass the two function parameters at same time I can't pass to it. Is it possible? If it's possible, how can it be done?

Answer 1

You cannot do what you are trying to achieve. When you call the function on clicking the first button, it will be executed with the '1' parameter and the condition will be false. Same with the second button and the paraneter 'a'. I would do something like this:

var lastCallParameter = '';

function letter(x)
{
   if((lastCallParameter  == '1' && x == 'a') || (lastCallParameter == 'a' && x == '1'))
   {
      document.getElementById('audio2').play();
      document.getElementById('ka').style.visibility = "true"
   }
   lastCallParameter   = x;
}

On that code, the function core will be executed only if you click on the 2 buttons one after the other. If you click one one button only, it won't do anything.

And your html code should be:

<img src="images/mei/off/01.png" id="ik" onclick="letter(1);"/>
<img src="images/uyir/off/01.png"  id="ah" onclick="letter('a');"/>

Unless you have a variable named 'a' somewhere in your code. In that case, you should remove the simple quote around 'a'. In your code, I can't understand if 'a' is a character or a variable defined somewhere else.

Plase note that, to avoid using a global variable (which is a bad thing), you could do this :

var letter = (function(){
   var lastCallParameter = '';

   return function(x)
    {
       if((lastCallParameter  == '1' && x == 'a') || (lastCallParameter == 'a' && x == '1'))
       {
          document.getElementById('audio2').play();
          document.getElementById('ka').style.visibility = "true"
       }
       lastCallParameter   = x;
    }
})();

But it would need you to know about closures and scopes to understand that code. If you don't, you can use the first version.

Answer 2

Your function is checking that x is equal to the number 1, and that a is truthy, but there is no a in that scope. Perhaps you want to know that x is either the number 1 or the letter a?

function letter(x) {
    if (x == 1 || x == 'a') {
        document.getElementById('audio2').play();
        document.getElementById('ka').style.visibility = "true"
    }
}

If you want to know that x is 1 and a is truthy, you need to supply it in your args:

function letter(x, a) {
    if (x == 1 && a) {
        document.getElementById('audio2').play();
        document.getElementById('ka').style.visibility = "true"
    }
}

<img src="images/mei/off/01.png" id="ik" onclick="letter(1, true);"/>
<img src="images/uyir/off/01.png"  id="ah" onclick="letter(1, 'still true');"/>