CODEWITHSUNDEEP
jquery
mahen23
mahen23

Reputation: 737

I need to show/hide elements with jquery

http://jsfiddle.net/MEKRM/ This is my fiddle

I want to show / hide elements when i click Next / Previous. However, IDs will be generated dynamically(mysql echo). Any ideas how i can proceed? Thanks

Upvotes: 0

Views: 143

Answers (4)

Naveed Ahmad
Naveed Ahmad

Reputation: 3175

You can do this way:

http://jsfiddle.net/naveed_ahmad/aQzVj/

Upvotes: 1

JohnP
JohnP

Reputation: 50009

This is what you're looking for : http://jsfiddle.net/MEKRM/5/

I added a .block classes to the blocks in case you have any other use for the .hideme class

$(document).ready(function() {
    $('.block:first').show();
    $('#next').click(function() {
        var $block = $('.block:visible:first'); //get the block that's visible
        if ($block.next().length) { //check if you have a next and move it there
            $block.hide().next().show();
        }
    });
    $('#previous').click(function() {
        var $block = $('.block:visible:first');
        if ($block.prev().length) {
            $block.hide().prev().show();
        }
    });
});

Upvotes: 5

Gazler
Gazler

Reputation: 84140

http://jsfiddle.net/MEKRM/4/

$(document).ready(function() {
        $("#1").show();

        $('#next').click(function(){
            $('.hideme:visible').hide().next().show();
            if ($('.hideme:visible').length == 0)
            {
                $('.hideme').first().show();
            }
        });

        $('#previous').click(function(){
            $('.hideme:visible').hide().prev().show();
            if ($('.hideme:visible').length == 0)
            {
                $('.hideme').last().show();
            }
        });

});

What this does, for all elements of class hideme is hide the current element, and display the next/previous one. It then does a check to make sure that one is visible, and if not shows the first/last one.

I'd Also recommend against using numeric IDs as they are not valid HTML. You should pre-fix them with a string such as "lorem1", "lorem2" etc.

Upvotes: 2

TakeMeAsAGuest
TakeMeAsAGuest

Reputation: 995

foreach(input in document.getElementsByTagName("input")
{
   if(input.indexOf('xyz') > -1)
   {
       //you found input you interested in
   }
}

Upvotes: -1

Related Questions