ROR和JS調試

Question

我剛剛通讀了一些關於在rails上使用ajax的教程。下面你可以看到一個從其中一個JS腳本中提取出來的JS腳本，這些腳本會導致一些錯誤，並在某處寫入一些文本。 （public/javascripts/application.js）

$('.submittable').live('change', function() { 
    $(this).parents('form:first').submit(); 
    fdafdasfewa 
    document.write("Welcome to my world!!!"); 
    echo "------------------"; 
}); 

事實上，該腳本仍然有效，沒有副作用。

document.write和echo將文本放在哪裏？

我怎麼能調試這樣的腳本，當我甚至不能看到它的輸出？那麼有時候我可能甚至無法確定是否運行。

Answer 1

嘗試把一個警報，以確保正在達到

$('.submittable').live('change', function() { 
    $(this).parents('form:first').submit(); 
    alert('reached this point'); 
    ... 

而且你的代碼，使用Firebug或Chrome的開發工具。在Mac上的Chrome上，快捷方式是用命令alt-i調出開發工具，然後單擊「控制檯」以啓動...控制檯。

在控制檯中可以鍵入

$('.submittable') 

爲了確保你的JS有一個DOM元素附加到。如果$('.submittable')什麼也沒有返回，那麼沒有選擇dom元素。你甚至可以在開發工具中設置斷點並逐步完成它們。創建一個斷點只是做

$('.submittable').live('change', function() { 
    $(this).parents('form:first').submit(); 
    debugger; 
    ... 

和開發工具將接管到達該行時。

Answer 2

我的猜測是，當您調用$(this).parents('form:first').submit()頁面發佈表單並且JavaScript沒有執行過此點時，這就是爲什麼它沒有向文檔拋出任何錯誤或寫入任何內容。

我會使用console.log與chrome或Firebug中的開發人員工具一起編寫測試輸出。這樣你就知道在控制檯中看，你也可以使用像斷點一樣的東西來觀察JavaScript的執行情況。