2013-12-12 3 views
0

Я работаю над проектом, в котором мне нужно использовать элемент управления tabbing с flybox. Для этого я ссылался на эту ссылку. http://www.my-html-codes.com/javascript-tabs-html-5-css3Событие windows.onload не называется

и в этом я внесли некоторые изменения. Я Gatting детали из другой страницы, называемые product_detail.aspx с помощью JQuery, как показано ниже

$('.inline2').click(function() 
       { 
       $('#inline_content').show(); 
       var myid=($(this)[0].attributes["data-id"].value); 
        $('#inline_content').html('<img src="images/ajax-loader.gif" style="margin-left: 50%;padding: 10px;"/>') 
        $.get("product_detail.aspx?product_id="+myid+"", function(data)  { 
         var resourceContent = data; 
         data=$(resourceContent).find('table#minicart1'); 
         $('#cboxLoadedContent div').html(); 
         $('#cboxLoadedContent div').html(data); 
         var aa= callmeonetime(); 
         return false; 
           // can be a global variable too... 
         // process the content... 

        }); 

и tabs.js функции

function callmeonetime() 
{ 
window.onload=function() { 

    // get tab container 
    var container = document.getElementById("tabContainer"); 
    // set current tab 
    var navitem = container.querySelector(".tabs ul li"); 
    //store which tab we are on 
    var ident = navitem.id.split("_")[1]; 
    navitem.parentNode.setAttribute("data-current",ident); 
    //set current tab with class of activetabheader 
    navitem.setAttribute("class","tabActiveHeader"); 

    //hide two tab contents we don't need 
    var pages = container.querySelectorAll(".tabpage"); 
    for (var i = 1; i < pages.length; i++) { 
     pages[i].style.display="none"; 
    } 

    //this adds click event to tabs 
    var tabs = container.querySelectorAll(".tabs ul li"); 
    for (var i = 0; i < tabs.length; i++) { 
     tabs[i].onclick=displayPage; 
    } 
} 

// on click of one of tabs 
function displayPage() { 
    var current = this.parentNode.getAttribute("data-current"); 
    //remove class of activetabheader and hide old contents 
    document.getElementById("tabHeader_" + current).removeAttribute("class"); 
    document.getElementById("tabpage_" + current).style.display="none"; 

    var ident = this.id.split("_")[1]; 
    //add class of activetabheader to new active tab and show contents 
    this.setAttribute("class","tabActiveHeader"); 
    document.getElementById("tabpage_" + ident).style.display="block"; 
    this.parentNode.setAttribute("data-current",ident); 
} 

window.onload=function() { 

    // get tab container 
    var container = document.getElementById("tabContainer"); 
     var tabcon = document.getElementById("tabscontent"); 
     //alert(tabcon.childNodes.item(1)); 
    // set current tab 
    var navitem = document.getElementById("tabHeader_1"); 

    //store which tab we are on 
    var ident = navitem.id.split("_")[1]; 
     //alert(ident); 
    navitem.parentNode.setAttribute("data-current",ident); 
    //set current tab with class of activetabheader 
    navitem.setAttribute("class","tabActiveHeader"); 

    //hide two tab contents we don't need 
    var pages = tabcon.getElementsByTagName("div"); 
     for (var i = 1; i < pages.length; i++) { 
     pages.item(i).style.display="none"; 
     }; 

    //this adds click event to tabs 
    var tabs = container.getElementsByTagName("li"); 
    for (var i = 0; i < tabs.length; i++) { 
     tabs[i].onclick=displayPage; 
    } 
} 

// on click of one of tabs 
function displayPage() { 
    var current = this.parentNode.getAttribute("data-current"); 
    //remove class of activetabheader and hide old contents 
    document.getElementById("tabHeader_" + current).removeAttribute("class"); 
    document.getElementById("tabpage_" + current).style.display="none"; 

    var ident = this.id.split("_")[1]; 
    //add class of activetabheader to new active tab and show contents 
    this.setAttribute("class","tabActiveHeader"); 
    document.getElementById("tabpage_" + ident).style.display="block"; 
    this.parentNode.setAttribute("data-current",ident); 
} 
} 

ныне thingis, когда я проверить функцию с помощью отладчика я получаю, что когда $.get("product_detail.aspx?product_id="+myid+"", function(data) называется получением данных с этой страницы, но в то же время вызывается событие callmeonetime(). Но в этом он пропускает windows.onload = function().

Так что не удалось получить вкладки на моей странице.

Итак, какие изменения я должен сделать, чтобы он работал правильно?

+0

Событие Window.onload для страницы "product_detail.aspx"? – Savaratkar

+0

nop его, чтобы получить вкладки, работающие над моим flywindow .. –

+0

@ theinsaneone- здесь, когда я пытаюсь отлаживать его выполнение внутри callmeonetime fnction, но не входит в любую 'window.onload = function()', поэтому я не получаю надлежащего вкладки –

ответ

1
$('.inline2').click(function() 
       { 
       $('#inline_content').show(); 
       var myid=($(this)[0].attributes["data-id"].value); 
        $('#inline_content').html('<img src="images/ajax-loader.gif" style="margin-left: 50%;padding: 10px;"/>') 
        $.get("product_detail.aspx?product_id="+myid+"", function(data)  { 
         var resourceContent = data; 
         data=$(resourceContent).find('table#minicart1'); 
         $('#cboxLoadedContent div').html(); 
         $('#cboxLoadedContent div').html(data); 

// CHANGED CODE... 
         var container = document.getElementById("tabContainer"); 
    // set current tab 
    var navitem = container.querySelector(".tabs ul li"); 
    //store which tab we are on 
    var ident = navitem.id.split("_")[1]; 
    navitem.parentNode.setAttribute("data-current",ident); 
    //set current tab with class of activetabheader 
    navitem.setAttribute("class","tabActiveHeader"); 

    //hide two tab contents we don't need 
    var pages = container.querySelectorAll(".tabpage"); 
    for (var i = 1; i < pages.length; i++) { 
     pages[i].style.display="none"; 
    } 

    //this adds click event to tabs 
    var tabs = container.querySelectorAll(".tabs ul li"); 
    for (var i = 0; i < tabs.length; i++) { 
     tabs[i].onclick=displayPage; 
    } 
        }); 
Смежные вопросы