ansaurus

Question

JS: Click h1 to set display to none at another div

Answer 1

+1 A:

You really should look at a javascript library such as jquery.

Keltex 2010-01-25 15:08:00

-1: This is too vague to be useful. A link to an example of something similar to what was requested that uses jQuery, fine, but this isn't particularly helpful.

David Dorward 2010-01-25 15:10:58

Answer 2

+1 A:

You have trapped into a common JS closure bug. Try this:

tb.onclick = function(val) {
                    return function() {
                    alert(val);
                    groupfields[val].style.display = 'none'; }
                }(iter);

Here you can read more about using closures and event handlers: http://www.webreference.com/programming/javascript/rg36/

alemjerus 2010-01-25 15:10:20

Answer 3

+1 A:

    function toggleGroups()
    {
        var titlebars = document.getElementsByClassName('titlebar_js'),
            groupfields = document.getElementsByClassName('inner_groups_gether'),
            tLength = titlebars.length,
            tb, iter;

        while (tLength--)
        {
            tb = titlebars[tLength];
            iter = tLength;
            tb.onclick = function(iter)
            {
                return function() 
                {
                    alert(iter);
                    groupfields[iter].style.display = 'none';
                }
            }(iter);
        }
    }
    window.onload = function()
    {
        toggleGroups(); // Aufruf der Funktion
    }

Raveren 2010-01-25 15:21:07

Answer 4

+2 A:

Hey, the other guy is right, jQuery is great for solving this very quickly. Example:

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"&gt;&lt;/script&gt;
    <script type="text/javascript">
        jQuery(window).bind("load", function() { 
            $('h1').click(function() {
                $('div.toBeHidden').css('display','none');
            });
        });
    </script>
</head>
<body bgcolor="yellow">
<h1>Click me!</h1>
<div class="toBeHidden">
    This block will be hidden after clicking the h1... 
</div> 
</body>
</html>

Here you are telling the browser to grab any h1 tag and make the divs with class "toBeHidden" to disappear.

You can learn bout jQuery here. It is worth it for sure. I rarely use pure javascript again after having started with jQuery.

Marcos Buarque 2010-01-25 15:21:43

Not adequate: the asker wants each `h1` to hide its respective `div`, not all of them.

Raveren 2010-01-25 15:23:49

ansaurus

tags:

views:

answers:

JS: Click h1 to set display to none at another div

related questions