Community Learn Tools Library Leisure

English

Home > Web Front-end > JS Tutorial > Use JQuery to quickly implement AJAX dynamic loading of Tab (explanation with examples)_jquery

Use JQuery to quickly implement AJAX dynamic loading of Tab (explanation with examples)_jquery

WBOY

Release： 2016-05-16 17:09:47

Original

853 people have browsed it

Let me briefly talk about the implementation process:

1. Find the link source, here is a series of links below

2. Processing styles

3. When the mouse moves over, load the website of the link source into the specified container, and switch the style to make the click event return false. The link source web page should not be clicked here

5.Over.

Script:

Copy code The code is as follows:

{
//homeNews
var tid = "#homeNews";//removeTabBold
var lvTabs = $(tid);
if(lvTabs != null)
{
lvTabs.find("a") .each(function(){$(this).click(function(){return false;});$(this).mouseover(function(){
removeTabBold(tid);$(this).addClass( "bold");
$(this).parent().addClass("lvbg");
$('#HomeNewsList').load($(this).href());
return false; }) });
$(LvTabId).find("a").each(function(){
$(this).removeClass("bold");
$(this).parent().removeClass( "lvbg");
$(this).parent().parent().parent().removeClass("lvp");}); }

Related labels：

tab

source：php.cn

Previous article：js css implements mask centered pop-up layer (scrolls with the browser window scroll bar)_javascript skills Next article：A simple example of jquery Tab effect and dynamic loading_jquery

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn