View Full Version : Any jQuery wizards out there?
power fuse0
30-05-11, 22:26
I need a little help,
I'm new to jQuery and want to get a little more familiar with it.
Basically, I want to know how to switch content in one box without changing the page (or URL).
So like an image transition or a text box that changes the text if you click a button with "next" on it or something.
Any ideas/examples or help?
It sounds like you need to hook onto the button and then perform your action from there, maybe increment a variable or something to indicate what to retrieve and then grab it with AJAX?
Something like this should help:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// The unique ID to tell you what to load
var data_id = 1;
// Hook a function to "nextbutton" where "nextbutton" is the ID of the button
$("#nextbutton").click(function () {
// This will call data_fetch.php, and will pass you the ID of the requested data as $_POST['data_to_fetch'], make sure to
// intval() that first or something to make it safe
$.post("data_fetch.php", { data_to_fetch: data_id },
// Function to handle the returned data
function(data) {
// Set the content of the element with ID "textbox" to the returned data
$("#textbox").html(data);
// Increment the data counter
data_id++;
}
);
});
});
</script>
This is a good site:
http://jqueryfordesigners.com/
Here's a link to the article on that site that relates to your question:
http://jqueryfordesigners.com/play-school-easy-ajax-load/
With regards to what you're wanting to do. It is good practice to make sure that when the user hits the back button it reloads the previous content and doesn't just take them back to another page if you get what i mean.
Say the user is on the aria site then goes to the home page of your site and then clicks a link that dynamically changes the content of the home page to some contact info for example. When the user hits the back button you want it to reload the home page content and not take them back to the last actual page which in this example would be the aria site.
When i come across a site where people haven't implemented this it really bugs me.
Here's an article from the site I've linked to above that addresses the back button issue:
http://jqueryfordesigners.com/enabling-the-back-button/
Hope this helps :)
Powered by vBulletin® Version 4.1.12 Copyright © 2012 vBulletin Solutions, Inc. All rights reserved.