Geek asks and answers

Changing the contents of a div when you click on a link / button

Basically I have a webpage with div id = "content" and div id = "sidebar",

What I would like to do is change the content in the content div when a link / button is clicked on the sidebar without having a sickle page for each article.

Cause:

I am making a BIO page for several groups, and for each group there will be several buttons, and then when the user clicks the button / link, the contents will change.

Any idea I studied .click using jQuery or maybe PHP, but not quite sure how to implement it.

+5
source share
3 answers

HTML , , ( , myArticles.html , ):

<div id='article1'>
    <b>ARTICLE 1</b> This is my first article
</div>

<div id='article2'>
    <b>ARTICLE 2</b> This is my second article
</div>

jQuery .load AJAX .

, 1 id = 'articleButton1' 2 id = 'articleButton2' ( href= '#', ), jQuery :

$('#articleButton1').click(function(){
    $('#content').load('myArticles.html #article1');
}

$('#articleButton2').click(function(){
    $('#content').load('myArticles.html #article2');
}

div #content div

+7

,

Tabify

+1

jQuery? http://jquery-ui.googlecode.com/svn/trunk/demos/tabs/vertical.html

on jQuery user interface tabs and loading content via ajax: http://jqueryui.com/demos/tabs/#ajax

+1
source

More articles:


All Articles