2014-01-23 104 views
1

我對JavaScript相當陌生,我相信我現在處於我的頭腦中。我搜索了四周的stackoverflow,但我無法找到我的特定問題的答案。「Object Expected」Breaking onClick事件(JavaScript)

雖然試圖觸發將引發JavaScript函數的onClick事件,但我收到來自IE8的錯誤「Breaking on JScript runtime error - Object expected」。該功能在Chrome中不起作用,吐出錯誤「Uncaught ReferenceError:hLight未定義。」

我粘貼了下面的相關代碼。

JavaScript的:

<script type="text/javascript"> 
    function hLight(id) { 
     var e = document.getElementById(id); 
     e.style.background-color = '#CCC'; 

     hUnLight(id); 
    } 
    function hUnLight(id) { 
     var awards = document.querySelectorAll('.award'); 
     for (var i = awards.length; i>=0; i--;) { 
      if (awards[i].id != id) { 
       awards[i].style.background-color = 'none'; 
      } 
     } 
    } 
</script> 

HTML:

<ul> 
    <li onClick="hLight('honors');"><a href="#honors">The Honors Incentive</a></li> 
    <li onClick="hLight('associate');"><a href="#associate">The Associate's Degree Incentive</a></li> 
    <li onClick="hLight('accelerated');"><a href="#accelerated">The Accelerated Incentive</a></li> 
</ul> 

<h2 class="award" id="honors">The Honors Incentive Eligibility Criteria</h2> 
<ul> 
    <li>1st time FOB HEA recipients that graduated from an accredited Indiana high school with a 3.0 or greater cumulative GPA will earn the Honors Incentive Award during their 1st year of FOB HEA eligibility.</li> 
    <li>Second, third, and fourth-year college students who qualify for FOB HEA and have earned a 3.0 or greater cumulative GPA will qualify for the Honors Incentive Award.</li> 
</ul> 
<h2 class="award" id="associate">The Associate’s Degree Incentive Eligibility Criteria</h2> 
<ul> 
    <li>Students that earn an Associate’s Degree will be awarded the Associate’s Degree Incentive to use while later pursuing their Bachelor’s Degree, provided their primary degree objective was the AS degree when it was earned.</li> 
</ul> 
<h2 class="award" id="accelerated">The Accelerated Incentive Eligibility Criteria</h2> 
<ul> 
    <li>Students that earn 39 or more credit hours during their prior student centric year will earn an Accelerated Incentive Award the following academic year.</li> 
</ul> 

這裏是一個的jsfiddle的要求:http://jsfiddle.net/QvRMf/

+0

顯示與我道歉了問題 – Sionnach733

回答

2

嘗試更新for loop作爲awards.length返回最高[陣列元件的總長度] integer值,它從0開始,另外background-color應該是backgroundColor

通過重新審視的問題,更新的答案和小提琴

更新JS:數組的

function hLight(id) { 
    var e = document.getElementById(id); 
    e.style.backgroundColor = '#CCC'; 

    hUnLight(id); 
} 

function hUnLight(id) { 
    var awards = document.querySelectorAll('.award'); 
    for (var i = 0; i < awards.length; i++) { 
     if (awards[i].id != id) { 
      awards[i].style.backgroundColor = ''; 
     } 
    } 
} 

Fiddle DEMO- Updated Latest

+0

一個的jsfiddle,但我忘了補充一點,我是用JavaScript的目標的項目。我已經添加了一個JSFiddle的信息,我也會更新原始問題代碼。 編輯:謝謝你的循環提示!我仍然掌握着這一點。 –

+0

@RyanBuss我已經用小提琴更新了我的答案!那是你需要的嗎? –

+0

是的!這正是我所期待的。謝謝! –

1

awards.length回報的長度,而不是最高指數。數組索引從零開始,因此最高索引至少比數組長度小1。

你應該只要改變你的for循環在零var i = 0;開始,不斷循環的索引號爲低,則數組長度i < awards.length;,並添加一個索引每個循環i++

例子:

for (var i = 0; i < awards.length; i++) {

HOBE,可以幫助你:)