Two comments...
1. There's nothing wrong with continuing to have your PHP code generate any
data that makes it easy to write your JavaScript code, such as your m1_div,
m1_link, m1_navlink, etc. jQuery doesn't demand that you do anything
differently.
2. If you do want to generate those other IDs in JavaScript code from a
single piece of information, it is very easy. JavaScript has excellent
string handling facilities. Going back to your proposed solution:
> The only solution apparent to me is to
> 1. grab the links and assign a click function to them
> 2. have the click function get the ID of the link, e.g. "m1_link"
> 3. extract the "base name" from the ID, e.g. "m1_link".replace
> ("_link","") = "m1"
> 4. append "_div" to the base name and use "m1_div" to select the
> appropriate DIV
>
> That would work fine, but it involves parsing the ID for a name
> component that is "common" to the link and the DIV.
Yes, indeed, that is exactly what you would do. But it's so simple - it
takes less code to do it than describe it. For example:
$(function() {
$('#left a').click( function() {
$( '#' + this.id.replace( '_link', '_div' ) ).doSomething();
});
});
Or another way to do the same thing:
$(function() {
$('#left a').click( function() {
$( '#' + this.id.split('_')[0] + '_div' ).doSomething();
});
});
Or if you have several related elements to operate on:
$(function() {
$('#left a').click( function() {
var base = '#' + this.id.replace( '_link', '_' );
$( base + 'div' ).doSomething();
$( base + 'navlink' ).doSomethingElse();
$( base + 'whatever' ).doWhatever();
});
});
What's not to like?
-Mike
> From: spud
>
> @Klaus Hartl -- Actually, the code I displayed was simply
> dummy code as an example; the real code either links to real
> URIs or isn't an A tag at all.
>
> Your usage of the hash property, however, does not really
> provide any more information than the same text used as an
> ID. So it's an alternative solution, but not really any more
> efficient.
>
> I suppose that my problem is conceptual more than anything,
> since I am also writing the PHP code that generates the
> output. My PHP code KNOWS
> -- at the moment that output is being generated -- what the
> IDs of all the related components are ("m1_div, m1_link,
> m1_navlink"). So it was convenient to hard-code these values
> in an inline onclick handler.
>
> The demands of jQuery-style javascript, however (and I'm not
> arguing about the logic of this method), is that my PHP code
> should ignore the information it has, and Javascript will
> re-create that information by parsing information from the
> link (whether in the hash or the ID) later on. It seems like
> extra work, but it does make things more flexible.
>
> spud.
>
> On Dec 26, 6:45 pm, Klaus Hartl <klaus.ha...@googlemail.com> wrote:
> > You said you don't want to litter your code with bogus
> classes, but -
> > speaking of unobtrusive - you do litter it with bogus anchors
> > (href="#"). That said, the most obvious solution to me is to give
> > these anchors a little more meaning by letting them point
> to the div
> > they seem to be connected to anyway:
> >
> > <a href="#m1_div">Module 1</a>
> >
> > Such semantically improved HTML will also make your
> scripting easier
> > (and theoretically - even if it may be not too much of a
> concern in a
> > CMS, it will degrade more gracefully).
> >
> > In your jQuery code you can then easily rely on the hash
> property to
> > access the associated elements, thus you get a pretty generic,
> > straightforward solution:
> >
> > $('a').click(function() {
> > var fragment = $(this.hash); // a div in our case
> > // do something with fragment, for instance toggle
> > // so something else
> >
> > });
> >
> > --Klaus
>
