On Jun 21, 4:22 pm, Tom Gregory <[EMAIL PROTECTED]> wrote:
> I'll bet what you're seeing is an implicit toString() implementation
> by the browser. You're getting elements back, but it's converting
> them output to hyperlinks when you alert().
I thought that but if a test the value more explicitly in the
iteration loop by outputting the type of the DOM object I get an
undefined output or at least a NULL value.
unction setupSwitches(){
//we define two arrays, containing our switches and divs.
var switchlinks = $$('a.switcher');
var stretchdivs = $$('.stretcher');
alert(switchlinks);
alert(stretchdivs);
//then we create the effect.
switchlinks.each(function(s){
alert(s.type); // This alert has not output at all it is NULL
s.onClick = function()
{
// function actions here
}
});
}
> TAG
>
> On Jun 21, 2007, at 9:15 AM, [EMAIL PROTECTED] wrote:
>
>
>
> > Hi I have a problem that I have never come across before while using
> > prototype...
>
> > I am using this selector $$('a.switch'), and I had expected and array
> > of DOM objects to be returned e.g.
> > [object HTMLAElement],[object HTMLAElement],[object HTMLAElement],
> > [object HTMLAElement]
>
> > but what I get is and array that contains the href value of the a tags
> > e.g.
>
> >http://www.domain.co.uk/page.html#
>
> > Is this a bug or am I missing something... I have some more long
> > winded javascript that works but I wanted to use the new CSS selectors
>
> > here is the code:
>
> > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> > "http://
> >www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> > <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">
> > <head>
>
> > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
> > <meta name="title" content="Expandable Div" />
> > <meta name="robots" content="index, follow" />
> > <meta name="description" content="checkbox" />
> > <meta name="keywords" content="checkbox" />
> > <meta name="language" content="en" />
>
> > <title>Expandable Div</title>
>
> > <link rel="shortcut icon" href="/favicon.ico" />
>
> > <script type="text/javascript" src="js/prototype.js"></script>
> > <script type="text/javascript" src="js/scriptaculous.js"></script>
> > <link rel="stylesheet" type="text/css" media="screen" href="css/
> > master.css" />
>
> > </head>
> > <body>
> > <h1>Expandable Div Example</h1>
> > <div>
> > <a href="#" id="switch1" class="switch">Click to expand 1</a>
> > <div id="region1" class="stretcher" style="display: none">
> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
> > vehicula dapibus nibh.
> > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
> > sapien enim fringilla velit,
> > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
> > platea dictumst. Nulla facilisi.
> > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
> > nulla nulla, posuere quis,
> > bibendum non, vestibulum sed, risus. Donec mollis hendrerit
> > libero.
> > Fusce eleifend lacus non
> > augue. In venenatis turpis ac diam.</p>
> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis
> > est,
> > ut pellentesque ipsum dolor
> > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
> > Vestibulum nec magna. Fusce convallis.
> > Donec blandit. Morbi lobortis magna et nulla. Aenean varius
> > lectus
> > id nisl. Nam vestibulum.
> > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
> > Integer turpis. Vivamus ut
> > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a,
> > enim.
> > In gravida eros.
> > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
> > venenatis arcu.</p>
> > </div>
> > </div>
> > <div>
> > <a href="#" id="switch2" class="switch">Click to expand 2</a>
> > <div id="region2" class="stretcher" style="display: none">
> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
> > vehicula dapibus nibh.
> > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
> > sapien enim fringilla velit,
> > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
> > platea dictumst. Nulla facilisi.
> > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
> > nulla nulla, posuere quis,
> > bibendum non, vestibulum sed, risus. Donec mollis hendrerit
> > libero.
> > Fusce eleifend lacus non
> > augue. In venenatis turpis ac diam.</p>
> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis
> > est,
> > ut pellentesque ipsum dolor
> > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
> > Vestibulum nec magna. Fusce convallis.
> > Donec blandit. Morbi lobortis magna et nulla. Aenean varius
> > lectus
> > id nisl. Nam vestibulum.
> > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
> > Integer turpis. Vivamus ut
> > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a,
> > enim.
> > In gravida eros.
> > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
> > venenatis arcu.</p>
> > </div>
> > </div>
> > <div>
> > <a href="#" id="switch3" class="switch">Click to expand 3</a>
> > <div id="region3" class="stretcher" style="display: none">
> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
> > vehicula dapibus nibh.
> > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
> > sapien enim fringilla velit,
> > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
> > platea dictumst. Nulla facilisi.
> > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
> > nulla nulla, posuere quis,
> > bibendum non, vestibulum sed, risus. Donec mollis hendrerit
> > libero.
> > Fusce eleifend lacus non
> > augue. In venenatis turpis ac diam.</p>
> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis
> > est,
> > ut pellentesque ipsum dolor
> > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
> > Vestibulum nec magna. Fusce convallis.
> > Donec blandit. Morbi lobortis magna et nulla. Aenean varius
> > lectus
> > id nisl. Nam vestibulum.
> > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
> > Integer turpis. Vivamus ut
> > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a,
> > enim.
> > In gravida eros.
> > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
> > venenatis arcu.</p>
> > </div>
> > </div>
> > <script type="text/javascript">
>
> > function setupSwitches(){
> > //we define two arrays, containing our switches and divs.
> > var switchlinks = $$('a.switch');
> > var stretchdivs = $$('.stretcher');
> > alert(switchlinks);
> > alert(stretchdivs);
>
> > //then we create the effect.
> > switchlinks.each(function(elem){
> > elem.onClick = function()
> > {
> > // function actions here
> > }
> > });
> > }
>
> > Event.observe(window, 'load', setupSwitches);
>
> > </script>
> > </body>
> > </html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
