2011-01-27 6 views
1

jquery 탭을 사용하고 있습니다. 탭에서 호출되는 정보는 배열에서 나옵니다. 그러나 언어 토글도 있으므로 선택된 언어에 따라 탭 이름과 내용이 변경됩니다.IE가 jquery 함수에서 배열을 호출하지 않는 이유는 무엇입니까?

내 코드는 탭 이름이 호출되었지만 탭 안의 내용이 아닌 IE를 제외한 모든 브라우저에서 작동합니다.

이것은 탭을 나타내는 코드입니다.

<script type="text/javascript"> 
$(document).ready(function() { 

//When loaded 
$(".tab_content").hide(); //Hide content 
$("ul.tabs li:first").addClass("active").show(); //Show tab one 
$(".tab_content:first").show(); //Show tab one content 

//On Click Event 
$("ul.tabs li").click(function() { 

$("ul.tabs li").removeClass("active"); //Remove any "active" 
$(this).addClass("active"); //Add "active" class to current tab 
$(".tab_content").hide(); //Hide all tab content 

var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
$(activeTab).fadeIn(); //Fade in the active ID content 
return false; 
}); 
}); 
</script> 

이것은 각 언어의 콘텐츠를 호출하기위한 코드입니다.

<script type="text/javascript"> 
     function getLanguageResources(){ 
    var fr = new Array(); var en = new Array(); 

en['greeting'] = "Hi!"; fr['greeting'] = "Salut!"; 


    var resources = new Array(); 
    resources['en'] = en; 
    resources['fr'] = fr; 


    return resources; 
} 


function changeLanguage(lang){ 
var langResources = getLanguageResources()[lang]; 

$("span[name='lbl']").each(function(i, elt){ 
    $(elt).text(langResources[$(elt).attr("caption")]); 
}); 

$("p[name='lbl']").each(function(i, elt){ 
    $(elt).text(langResources[$(elt).attr("caption")]); 
    }); 

$("a[name='lbl']").each(function(i, elt){ 
    $(elt).text(langResources[$(elt).attr("caption")]); 
    }); 
} 

$(document).ready(function() { 
$("input[name='languagebutton']").click(function() { 
    changeLanguage($(this).val()); 
}); 

$(document).ready(
    changeLanguage("en")); 

}); 

은 나뿐만 inititally 탭의 이름은 표시하지 않았다, 나는 탭이 나타나 태그를 사용하지만, 컨텐츠의 나머지는하지 않았다 때 내 입력 된 텍스트의 태그를 변경했습니다.

도움을 주셔서 감사합니다.

+0

우선, 자세한 내용을 추가 할 때 질문을 업데이트; SO는 포럼이 아니며 응답은 다른 사용자에게 응답하는 것이 아닙니다. 당신이 등록하지 않았 으면, 당신의 경우에하기가 어려울 것입니다; 이 계정은 쿠키를 기반으로합니다. 이 질문을 등록하고 플래그를 지정하면이 계정을 등록 된 계정으로 병합 할 수 있습니다. 둘째로, SO는 특정 질문을하는 것이지 "여기에 코드가 있습니다. 내가 뭘 잘못하고 있니?" 코드 경로의 절벽에 가려면 자매 사이트 [codereview.SE] (http://codereview.stackexchange.com/)를 방문하십시오. – Will

답변

0

내 구현이 올바른지 확인한 후 FF 및 IE에서 작동합니다.

<ul class="tabs"> 
<li><a href="#tab1"><span name="lbl" caption="greeting"></span></a></li> 
<li><a href="#tab2"><span name="lbl" caption="hello"></span></a></li> 
<li><a href="#tab3"><span name="lbl" caption="greeting"></span></a></li> 
<li><a href="#tab4"><span name="lbl" caption="hello"></span></a></li> 
</ul> 

<div class="tab_content" id="tab1"> 
    tab 1 
    <p name="lbl" caption="greeting"></p> 
</div> 
<div class="tab_content" id="tab2"> 
    tab 2 
    <p name="lbl" caption="hello"></p> 
</div> 
<div class="tab_content" id="tab3"> 
    tab 3 
    <p name="lbl" caption="greeting"></p> 
</div> 
<div class="tab_content" id="tab4"> 
    tab 4 
    <p name="lbl" caption="hello"></p> 
</div> 

<input type="button" name="languagebutton" value="en"/> 
<input type="button" name="languagebutton" value="fr"/> 

그것은이다 :

나는 변수 등

jQuery: 
function getLanguageResources(){ 
    return { 
     "fr":{ 
      'greeting':'Salut!', 
      'hello':'Hello FR' 
     }, 
     "en":{ 
      'greeting':'Hi!', 
      'hello':'Hello EN' 
     } 
    } 
} 
function changeLanguage(lang){ 
var langResources = getLanguageResources()[lang]; 

$("span[name='lbl']").each(function(i, elt){ 
    $(elt).text(langResources[$(elt).attr("caption")]); 
}); 

$("p[name='lbl']").each(function(i, elt){ $(elt).text(langResources[$(elt).attr("caption")]); }); 
$("a[name='lbl']").each(function(i, elt){ $(elt).text(langResources[$(elt).attr("caption")]); }); 
} 

$(document).ready(function() { 

//When loaded 
$(".tab_content").hide(); //Hide content 
$("ul.tabs li:first").addClass("active").show(); //Show tab one 
$(".tab_content:first").show(); //Show tab one content 

//On Click Event 
$("ul.tabs li").click(function() { 

$("ul.tabs li").removeClass("active"); //Remove any "active" 
$(this).addClass("active"); //Add "active" class to current tab 
$(".tab_content").hide(); //Hide all tab content 

var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
$(activeTab).fadeIn(); //Fade in the active ID content 
return false; 
}); 


$("input[name='languagebutton']").click(function() { 
    changeLanguage($(this).val()); 
}); 
changeLanguage("en"); 
}); 

그리고 HTML 제작 한 욕실, 하나, FR에 대한 필요성에 모두 넣을 수있는 배열 구조를 변경 한 나를 위해 잘 작동, 당신은 name 대신 아마도 id 사용해야하지만 잘 작동합니다.

여전히 작동하지 않으면 HTML, jquery 코드를 온라인에 게시하십시오.

건배

G.

관련 문제