Yeah, I thought that looked familiar. ;-) Glad you like the book. Let
me know if you need any more help with that.
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Apr 11, 2009, at 7:49 PM, Calvin Stephens wrote:
Hi Karl,
I was actually trying to build on a tutorial from your book- "Learning
jQuery 1.3". The example was from Chapter 6 (the appending HTML/ AHAH
technique). Your solution will more than likeley work... I was just
trying to figure out how to make some reuseable code for all of the
links.
Your book is pretty good by the way!
Thanks for your time,
Calvin
On Sat, Apr 11, 2009 at 4:39 PM, Karl Swedberg
<k...@englishrules.com> wrote:
Hi Calvin,
One way you can simplify things is to give each of those containers
(#letters-a, #letters-b, etc.) the same class -- for example,
"letters".
Bind a click handler to all links within element that have
class="letters"
Then, inside the click handler, you're going to load a file based
on the
last character of the container's id. To do so, first store that
letter in a
variable:
1. traverse up through the parent nodes until you find the element
with the
"letters" class
2. grab its id. (for example "letters-a")
3. slice the last letter of that id (e.g. "a")
When you use the load method, concatenate the variable and ".html"
This is what it might look like:
$(document).ready(function() {
$('.letters a').click(function() {
var letter = $(this).parents('.letters')[0].id.slice(-1);
$('#dictionary').load(letter + '.html');
return false;
});
});
Hope that helps.
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Apr 11, 2009, at 5:46 PM, Calvin wrote:
I have a simple index page with 3 links(with separate ids) and a
empty
<div></div> tag(with an id). I am able to get content to load into
the
empty div tags but I am also repeating jquery code to do so. I have
limited experience creating variables and switch/case statements and
I'm thinking that's the best way to go but can't get the code to
work.
Here is the code I have so far:
$(document).ready(function() {
$('#letter-a a').click(function(){
$('#dictionary').load('a.html');
return false;
});
});
$(document).ready(function() {
$('#letter-b a').click(function(){
$('#dictionary').load('b.html');
return false;
});
});
$(document).ready(function() {
$('#letter-c a').click(function(){
$('#dictionary').load('c.html');
return false;
});
});
