2012-03-07 66 views
0

我想通過點擊按鈕來顯示和隱藏元素,但它不起作用,它可以在Chrome瀏覽器上工作,但不能在IE8上工作。在頁面開始處,你只需要看到第一個div,其他的都應該隱藏起來(這在IE8上有效),但是當我點擊下一個按鈕時,它應該隱藏第一個div並且只顯示第二個div。 我正在使用jQuery 1.7.1。 請參閱下面的代碼。IE8上的jQuery功能問題

IM很抱歉,這是所有的頁面代碼

<html> 

<HEAD> 
<style type="text/css" > 
form{ 
    background:#06F; 

} 
span{ 
    float:left; 
} 
#q1{ 
    display:block; 
} 
#q2{ 
    display:none; 
} 
#q3{ 
    display:none; 
} 
#q4{ 
    display:none; 
} 
#q5{ 
    display:none; 
} 
input{ 
    float:left; 
} 
</style> 
<script type="text/javascript" src="jquery-1.7.1.min.js"></script> 

<SCRIPT LANGUAGE="JavaScript"> 


var ans = new Array; 
var done = new Array; 
var yourAns = new Array; 
var explainAnswer = new Array; 

var score = 0; 
ans[1] = "b"; 
ans[2] = "b"; 
ans[3] = "a"; 
ans[4] = "c"; 
ans[5] = "b"; 

explainAnswer[1]="The reason why Answer 1 is Blah Blah Blah"; 
explainAnswer[2]="The reason why Answer 2 is Blah Blah Blah"; 
explainAnswer[3]="The reason why Answer 3 is Blah Blah Blah"; 
explainAnswer[4]="The reason why Answer 4 is Blah Blah Blah"; 
explainAnswer[5]="The reason why Answer 5 is Blah Blah Blah"; 

function Engine(question, answer) { 
yourAns[question]=answer; 
} 

function Score(){ 
var answerText = "How did you do?\n------------------------------------\n"; 
for(i=1;i<=5;i++){ 
    answerText=answerText+"\nQuestion :"+i+"\n"; 
    if(ans[i]!=yourAns[i]){ 
    answerText=answerText+"\nThe correct answer was "+ans[i]+"\n"+explainAnswer[i]+"\n"; 
    } 
    else{ 
    answerText=answerText+" \nCorrect! \n"; 
    score++; 
    } 
} 

answerText=answerText+"\n\nYour total score is : "+score+"\n"; 

//now score the user 
answerText=answerText+"\nComment : "; 
if(score<=0){ 
answerText=answerText+"You need to learn some more"; 
} 
if(score>=1 && score <=2){ 
answerText=answerText+"bit more practice"; 
} 
if(score>=3 && score <=3){ 
answerText=answerText+"doing ok"; 
} 
if(score>4){ 
answerText=answerText+"You are one hot java babe!"; 
} 

alert(answerText); 
var fso = new ActiveXObject("Scripting.FileSystemObject"); 
var s = fso.CreateTextFile("\\omriljedocpd01\OMRILAPPS\OmrilDocs\Omrix Public\All Omrix Public\Training", true); 
s.WriteLine(answerText); 
s.Close(); 

} 

function toggleDivStart(divId) { 
    $("#q1").toggle(); 
    $("#q2").toggle(); 
    $("#q3").toggle(); 
    $("#q4").toggle(); 
    $("#q5").toggle(); 
} 
function toggleDiv12(divId) { 
    $("#q1").toggle(); 
    $("#q2").toggle(); 
} 
function toggleDiv23(divId) { 
    $("#q2").toggle(); 
    $("#q3").toggle(); 
} 

function toggleDiv34(divId) { 
    $("#q3").toggle(); 
    $("#q4").toggle(); 
} 
function toggleDiv45(divId) { 
    $("#q4").toggle(); 
    $("#q5").toggle(); 
} 
$(function() { 
     $("#radio").buttonset(); 
    }); 

</script> 

</HEAD> 

<!-- STEP TWO: Copy this code into the BODY of your HTML document --> 

<BODY> 

<DIV ALIGN="CENTER"> 
<h1>Java Quiz</h1> 
<b>Test your knowledge of Java!</b> 
<hr> 
<FORM> 

<div id="q1"> 
<b>1. What is the name of the Java mascot?</b><br> 
<input type=radio name="q1" value="a" onClick="Engine(1, this.value)"><span>a) Luke</span><br> 
<input type=radio name="q1" value="b" onClick="Engine(1, this.value)"><span>b) Duke</span><br> 
<input type=radio name="q1" value="c" onClick="Engine(1, this.value)"><span>c) Nuke</span><br> 
<input type=radio name="q1" value="d" onClick="Engine(1, this.value)"><span>d) Sunny</span><p> 
    <button id="removeClass"><a href="javascript:toggleDiv12('q1');" >Next</a></button> 

</div> 
<div id="q2"> 
<b>2. Where is the best place to get Java software?</b><br> 
<input type=radio name="q2" value="a" onClick="Engine(2, this.value)"><span>a) From a can</span><br> 
<input type=radio name="q2" value="b" onClick="Engine(2, this.value)"><span>b) From java.sun.com</span><br> 
<input type=radio name="q2" value="c" onClick="Engine(2, this.value)"><span>c) You have to buy it from Microsoft</span><br> 
<input type=radio name="q2" value="d" onClick="Engine(2, this.value)"><span>d) From your local Star Bucks</span><p> 
    <button id="addClass2"><a href="javascript:toggleDiv12('q1');" >Preview</a></button> 
    <button id="removeClass2"><a href="javascript:toggleDiv23('q2');" >Next</a></button> 
</div> 
<div id="q3"> 
<b>3. A 'for' loop in Java looks like this....</b><br> 
<input type=radio name="q3" value="a" onClick="Engine(3, this.value)"><span>a) for(int i=0;i<5;i++){}</span><br> 
<input type=radio name="q3" value="b" onClick="Engine(3, this.value)"><span>b) for i=1 to 5 do</span><br> 
<input type=radio name="q3" value="c" onClick="Engine(3, this.value)"><span>c) repeat...until(i=5)</span><br> 
<input type=radio name="q3" value="d" onClick="Engine(3, this.value)"><span>d) FOR I:=5 DOWNTO 1 DO</span> <p> 
    <button id="addClass3"><a href="javascript:toggleDiv23('q2');" >Preview</a></button> 
    <button id="removeClass3"><a href="javascript:toggleDiv34('q3');" >Next</a></button> 
</div> 
<div id="q4"> 
<b>4. Which platform can not run Java.</b><br> 
<input type=radio name="q4" value="a" onClick="Engine(4, this.value)"><span>Linux</span><br> 
<input type=radio name="q4" value="b" onClick="Engine(4, this.value)"><span>Windows NT</span><br> 
<input type=radio name="q4" value="c" onClick="Engine(4, this.value)"><span>Commodore 64</span><br> 
<input type=radio name="q4" value="d" onClick="Engine(4, this.value)"><span>Apple Mac</span> 
<p> 
    <button id="addClass4"><a href="javascript:toggleDiv34('q3');" >Preview</a></button> 
    <button id="removeClass4"><a href="javascript:toggleDiv45('q4');" >Next</a></button> 
</div> 

<div id="q5"> 

<b>5. 'JMF' stands for: </b><br> 
<input type=radio name="q5" value="a" onClick="Engine(5, this.value)"><span>A pop group of the 90's who had the hit "Unbelievable"</span><br> 
<input type=radio name="q5" value="b" onClick="Engine(5, this.value)"><span>Java Media Framework</span><br> 
<input type=radio name="q5" value="c" onClick="Engine(5, this.value)"><span>Java Messaging Framework</span><br> 
<input type=radio name="q5" value="d" onClick="Engine(5, this.value)"><span>Java Meditation Forum</span><p> 
    <button id="addClass5"><a href="javascript:toggleDiv45('q4');" >Preview</a></button> 
    <input type=button onClick="Score()" value="Well... How did I do?"> 
</div> 

</FORM> 
</DIV> 

<body> 
<html> 
<p>&nbsp; </p> 
please help me 

我有編輯的代碼,現在這是在Chrome Safari瀏覽器上運行完整的頁面代碼

+0

你能否發佈你的HTML代碼? – 2012-03-07 09:43:40

+0

請編輯此職位的標題。我向你保證,jQuery在IE中工作 – 2012-03-07 09:43:52

+0

此代碼不完整。它所在的HTML在哪裏?事件處理程序如何以及在哪裏更改附加到「下一個」按鈕的顯示div?您錯過了開始的'

1

如果這是您正在使用的實際代碼,那麼您錯過了一個開頭<script type="text/javascript">標記。在您的JS代碼之後,我看到關閉</script>,但在您的JavaScript代碼之前關閉</style>之後沒有打開腳本標記。

0

你需要的地方調用一個函數,無後?

我看到你聲明他們,什麼調用/調用他們?