2015-02-08 133 views
0

我試圖運行下面的代碼,但鉻顯示意外的令牌非法的。 任何人都可以幫忙嗎?JavaScript Uncaught語法錯誤:意外的令牌ILLEGAL

當我按一下按鈕,就應該添加標記,當它發現圖像/ 1h.jpg它不存在,它應該引發的onerror事件和運行功能ONC()添加一些CSS和加載另一張圖片,但它沒有運行函數onc()當我訪問控制檯,它顯示未捕獲的SyntaxError:意外的令牌非法的

<button id='a' onclick="onc();">aaa</button> 
 
<div></div>

function onc(){ 
 
\t var path1= 'images/1h.jpg';//Does not exist 
 
\t var path2= 'images/1s.jpg';//exist 
 
\t var tmp = "<img src='"+path1+"' onerror='nofind(this,"+path2+");' /> "; 
 
\t $('div').html(tmp); 
 
}
我搜索了一些答案,似乎用 「」 或 '' 造成的,但我真的不知道如何解決我的代碼。謝謝。

回答

7

在HTML屬性文字渲染JavaScript中,您在path2有字符串將不加引號,它會是這樣的:

onerror='nofind(this,images/1s.jpg);' 

一種解決辦法是把它放在引號:

var tmp = "<img src='"+path1+"' onerror='nofind(this,\""+path2+"\");' /> "; 
// Change is here -----------------------------------^^---------^^ 

...這使得這樣的:

onerror='nofind(this,"images/1s.jpg");' 

一個更好的解決方案,但,根本不會使用onXyz屬性。沒有理由。相反,使用現代的事件處理:

function onc(){ 
    var path1= 'images/1h.jpg';//Does not exist 
    var path2= 'images/1s.jpg';//exist 
    var img = $("img").on("error", function() { 
        nofind(this, path2); 
       }).attr("src", path1); 
    $('div').html(img); 
} 

請注意,我們前鉤error事件設置src屬性。對於error,這可能並不是絕對必要的,這取決於錯誤的原因,但這是一個很好的習慣,對於相關的load事件可能有很大影響。 (在設置src之後,您可以勾選load事件;它的工作原理大部分爲,但如果瀏覽器具有緩存的圖像並且緩存設置允許瀏覽器在不重新驗證它的情況下重用它,則可能不會,在這種情況下,只要設置了src,瀏覽器就會觸發load事件,並且在沒有看到任何JavaScript處理程序的情況下,在JavaScript線程下次可以運行處理程序時,不會將它們排隊運行[只有一個主JavaScript UI線程,但瀏覽器是多線程。])

+0

真的非常感謝TJ!有用。這讓我很困惑。你太酷了! – leo 2015-02-08 17:31:32

+0

@leo::-)不用擔心。 – 2015-02-08 17:32:47

相關問題