Actually I think I did find a workaround. If I do $(element).css
('display', 'none') it works, but $(element).hide () doesn't for some
reason.
On Jun 28, 3:00 pm, Gordon <[EMAIL PROTECTED]> wrote:
> Further experimentation seems to suggest that the problem is that
> effects like show and hide don't appear in document.ready in Safari.
> I don't know why this would be but I really do need some kind of
> effective workaround.
>
> On Jun 28, 11:01 am, Gordon <[EMAIL PROTECTED]> wrote:
>
> > I am having an odd problem with Safari and hiding a collection of
> > elements. I'm using jQuery 1.1.2 until 1.1.3 reaches release
> > quality.
>
> > The situaition is as follows: There is a fieldset in a form for
> > filling out addresses. If the browser is javascript-capable then this
> > fieldset is hidden and some new ones generated. The first holds a
> > single input for a postcode, the second one will list the results of
> > the lookup, as retrieved by an AJAX query. The fields in the hidden
> > fieldset will be loaded with the correct values based on the result
> > the user clicks on and the fieldset will then be shown again filled
> > out.
>
> > During initialization my script generates the new fieldsets with
> > before() and text strings. It also adds some text links to the
> > existing fieldset with append() for navigating through the inserted
> > fieldsets. Only one of the 3 fieldsets (lookup, results, address
> > fields) will be visible at any one time.
>
> > I have some code that looks something like this in my javascript:
>
> > var address = $('#address');
> > address.before ('<fieldset id="lookup"><!--input fields--><p><a
> > class="gotoaddr" href="#">Enter address</a> <a class="gotores"
> > href="#">Go to results</a></p></fieldset>')
> > address.before ('<div id="results'"
> > style="display:none;"><!--results--><p><a class="gotosearch"
> > href="#">Search again</a> <a
>
> > class="gotoaddr" href="#">Enter address</a></p></div>');
> > address.append (<p><a class="gotosearch" href="#">Search again</a> <a
> > class="gotores" href="#">Go to results</a></p>);
>
> > addrlinks = $('.gotoaddr');
> > searchlinks = $('.gotosearch.');
> > reslinks = $('.gotores');
>
> > reslinks.click (function (){alert ('this is a test');});
> > reslinks.hide ();
> > address.hide ();
>
> > The problem only seems to happen in Safari 3 for Windows. Haven't had
> > a chance to try the Mac version yet. The problem is that all the
> > reslinks links get the click events attached, but only the one that
> > was appended to the "address" fieldset gets hidden. The one in the
> > "lookup" fieldset remains visible.
>
> > I know that jQuery is grabbing the element as it should because it
> > gets the event attached to it. Additionally the link that remains
> > visible in Safari is hidden in my other test browsers. I tried
> > console.log (reslinks.length) and got 2 back in all browsers, but one
> > of the links just does not hide in Safari.
>
> > I tried other approaches, such as creating the links with "display:
> > none" but then when the show() calls were made later in the script to
> > reveal the links they were given a style of "display: block" in spite
> > of the fact that I wanted them to be inline elements as they would be
> > by default. I could modify the script so that the calls to show
> > explicitly set "display: inline" with a callback, but then what
> > happens if the designer decides to style the links to be something
> > other than inline elements?
>
> > I'd really appreciate some feedback on this problem. If anyone else
> > has encountered it then please let me know.
