-3

I'm trying to create a button which will show a div if it is hidden, or hide the div if it is already shown (doing it in javascript). I've written this code to be used onclick but it doesn't seem to work and I can't see why. Can someone see what I have done wrong?

if (document.getElementById('Hidey').style.display == 'none') {
document.getElementById('Hidey').style.display = 'inline'
}
else {
document.getElementById('Hidey').style.display = 'none'
}

EDIT: HTML

<div id="Button" onclick="javascript posted above here"><h2>Click</h2></div>
<div id="Hidey">Content Inside</div>

That's the HTML being effected, nothing else in my code effects these. I'm simply confused.

Curtis Thompson
  • 7
  • 5
  • 4
    We need more code... post your HTML too... – DZanella Sep 01 '15 at 14:39
  • 1
    Share the HTML. The javascript code must work – Marcos Pérez Gude Sep 01 '15 at 14:39
  • 1
    works fine **[here](https://jsfiddle.net/Guruprasad_Rao/q40wgj86/)** – Guruprasad J Rao Sep 01 '15 at 14:40
  • Is this code part of some function, and which event activates it? If it is running on page load - you will probably not see element with specified id... – sinisake Sep 01 '15 at 14:44
  • 2
    Are you using the script block directly inside of onclick?? not as a function?? – DZanella Sep 01 '15 at 14:46
  • Does your `Hidey` div really have content? – MrUpsidown Sep 01 '15 at 14:48
  • 1
    Your `onclick` event should call a function, which contains the code above (which isn't particularly wrong, although repeated calls to getElementById seem a bit wasteful) – Michael McMullin Sep 01 '15 at 14:49
  • By onclick let me know your custom function is executing or not putting alert before if() statement.. – Suresh Sep 01 '15 at 14:50
  • Yeah, it has lots of content inside but I didn't post it all here, there's no need. – Curtis Thompson Sep 01 '15 at 14:50
  • Post your complete code, incl. function, function names, etc. – MrUpsidown Sep 01 '15 at 14:51
  • I think your problem is use the script directly on "onclick"... Use as a function, how this exemples posted in coments and answers... – DZanella Sep 01 '15 at 14:53
  • @DZanella I think that might have been the problem but I don't understand why it is a problem. I've used a function now like one of the answers suggested and it worked. – Curtis Thompson Sep 01 '15 at 14:57
  • maybe works directly on "onclick" if you dont use breaklines in script block... – DZanella Sep 01 '15 at 14:58
  • Also, why is my question and all the answers getting down-voted? An answer that works got down-voted and my question got down-voted, I think that is stupid. Do people hate my question or something? – Curtis Thompson Sep 01 '15 at 14:59
  • @CurtisThompson: Downvotes are supposed to mean "This question does not show any research effort; it is unclear or not useful." Don't think of them as "people hate", more as an indication that your question could be improved or in some cases, doesn't belong here. If you had included a [mcve] right away, you probably wouldn't have received so many. – Cᴏʀʏ Sep 01 '15 at 17:23

2 Answers2

0

I've set up a plunker here http://plnkr.co/edit/EkuW8nEIV22vmuaDM9JR?p=preview.

<script>
  var toggle = function(){
    if (document.getElementById('Hidey').style.display == 'none') {
      document.getElementById('Hidey').style.display = 'inline'
    }
    else {
      document.getElementById('Hidey').style.display = 'none'
    }
  }

</script>

<h1 id="Hidey">Hello Plunker!</h1>
<a href="#" onclick="toggle()">click me</a>

Your code seems good. I think you maybe weren't setting up the function correctly or calling the function correctly.

Joseph Evans
  • 1,360
  • 9
  • 14
  • I've copied what you did and it worked. I don't understand what I did wrong though. – Curtis Thompson Sep 01 '15 at 14:55
  • Why a down-vote? This answer shows that what OP is trying works fine and it is complete. – MrUpsidown Sep 01 '15 at 15:05
  • Do you guys know why my question got down-voted? It's only my first question but I'd rather go somewhere else if people hate me asking simpler things. – Curtis Thompson Sep 01 '15 at 15:09
  • 2
    The question is very basic and has many solutions returned from a simple google search. In the future post more complete code and google a little harder before posting. If you post a JSFiddle or a Plunker of your code it is very helpful and allows us to more easily explain what went wrong and why it isn't working. – Joseph Evans Sep 01 '15 at 15:12
  • Well I did google search before I posted and got a similar result to my code, and your answer was pretty similar to my code. Is this place only for professionals? – Curtis Thompson Sep 01 '15 at 15:15
  • 2
    This place is by no means only for professionals. Feel free to post any questions you have just make sure they are structured well and contain complete code for the problem you need help with. – Joseph Evans Sep 01 '15 at 15:19
  • 1
    Not at all. It is for everyone. But you need to show that you have searched before asking and could not find an appropriate answer + you need to post a [Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve) of your code, so that we are able to help. If you don't do at least that, your question is likely to get down-voted. – MrUpsidown Sep 01 '15 at 15:20
  • 2
    FYI I down-voted your question because there are already tons of identical questions on this site and information such as `javascript posted above here` is not helping us to help you. You could simply have a typo or anything else in your onclick. – MrUpsidown Sep 01 '15 at 15:23
  • Okay, thanks for solving my problem guys. I gave a working answer to a question earlier and that got down-voted too but I don't know why, other people just down-vote everything I do so I'll have to go somewhere more welcoming next time. – Curtis Thompson Sep 01 '15 at 15:24
  • 2
    No I don't think you should take it like that. Just learn how to ask a good question or post a good answer, and you will receive up-votes. And you will be part of the community :-) – MrUpsidown Sep 01 '15 at 15:26
  • @CurtisThompson: Is [so] only for professionals? No. But there are many in the community here, and I suspect that most of them are quite busy. Questions are easier (and faster!) to answer when everything needed to debug them is present. As I commented before, your question did not include a [mcve], which would have, generally, led straight to an answer instead of a barrage of comments asking for further explanation. – Cᴏʀʏ Sep 01 '15 at 17:28
-3

Use jQuery and just use this:

$("button").onclick( function() {("#Hidey").toggle();});
Jonas Hoffmann
  • 37
  • 1
  • 6