Passing an argument to a function

Question

Very simply I want to use the following code several times on my page for a number of 'boxes', so how can I pass an argument when it's called ie calling conceal(box1ID) would conceal box1ID and so on.....

function conceal() {      
        if(document.getElementById('box1ID').style.display=='block') {
          document.getElementById('box1ID').style.display='none';
        }
        return false;
    }  

function show() {
    if(document.getElementById('box1ID').style.display=='none') {
      document.getElementById('box1ID').style.display='block';
    }
    return false;
}

If you're asking how to pass an argument to a function, that's pretty basic. It's the sort of thing I'd expect you'd have learned while reading your introductory tutorials/books. Have I misinterpreted your question? — user2437417
– user2437417, Commented Jul 10, 2013 at 13:49

Jamie Hutber · Accepted Answer · 2013-07-10 13:49:16Z

2

Its very simple, just write it and include it...

    function conceal(element) {      
        if(document.getElementById(element).style.display=='block') {
          document.getElementById(element).style.display='none';
        }
        return false;
    }  

    function show(element) {
        if(document.getElementById(element).style.display=='none') {
          document.getElementById(element).style.display='block';
        }
    return false;
    }

Call it like so:
conceal('box1ID');

answered Jul 10, 2013 at 13:49

Jamie Hutber

28.2k54 gold badges194 silver badges314 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alex Guerra · Accepted Answer · 2013-07-10 13:52:08Z

I'm not sure what you need. Is something like this?

function conceal(boxId) {      
        if(document.getElementById(boxId).style.display=='block') {
          document.getElementById(boxId).style.display='none';
        }
        return false;
    }  

function show(boxId) {
    if(document.getElementById(boxId).style.display=='none') {
      document.getElementById(boxId).style.display='block';
    }
    return false;
}




show('box1ID');
conceal('box1ID');

Gintas K · Accepted Answer · 2013-07-10 13:49:29Z

1

You mean like this?

function conceal(boxID) {      
    if(document.getElementById(boxID).style.display=='block') {
      document.getElementById(box1ID).style.display='none';
    }
    return false;
}

and

function show(boxID) {
    if(document.getElementById(boxID).style.display=='none') {
      document.getElementById(boxID).style.display='block';
    }
    return false;
}

answered Jul 10, 2013 at 13:49

Gintas K

1,4783 gold badges18 silver badges39 bronze badges

Comments

mplungjan · Accepted Answer · 2013-07-10 13:55:14Z

Here I save some code

function showhide(id,show) {      
  document.getElementById(id).style.display=show?'block':'none';
  return false;
}

usage inline (I assume you use inline due to the return false)

<a href="#" onclick="return showhide('box1ID',true)">Show</a>
<a href="#" onclick="return showhide('box1ID',false)">Hide</a>

To toggle use

function toggle(id) {      
  document.getElementById(id).style.display=document.getElementById(id).style.display=="block"?"none":"block";
  return false;
}

usage inline (I assume you use inline due to the return false)

<a href="#" onclick="return toggle('box1ID')">Toggle</a>

Arun Chandran Chackachattil · Accepted Answer · 2013-07-10 13:51:26Z

0

<input type="Button" onclick="conceal(this.id)"/>

Javascript:

function conceal(buttonId) {      
    if(document.getElementById('+buttonId+').style.display=='block') {
      document.getElementById('+buttonId+').style.display='none';
    }
    return false;
}

answered Jul 10, 2013 at 13:51

Arun Chandran Chackachattil

3,3627 gold badges33 silver badges45 bronze badges

Collectives™ on Stack Overflow

Passing an argument to a function

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Related