2012-12-06 30 views
2

我發生onclick事件後傳遞DOM對象,我需要知道從HTML傳遞的元素的id。我已閱讀了JavaScript中存在的this.id,但似乎無法正確使用它。在JavaScript中使用this.id?

這裏是我的功能代碼:

function clickFunction() { 
    $(".tictactoe").on('click', function() { 

     $(this).text("X"); 
     if (this.id == "upleft") { 
      $('#upright').text("yes"); 
     } 
    }); 
} 

$(document).ready(function() { 
    $('#playagain').hide(); 
    $('.tictactoe').on("click"); 

    clickFunction(); 

}); 

所以,我認爲我的快速測試,如果成功的話,會出現這個詞是在一個井字的網格右上角時吧我點擊了左邊的位置。

或許我的比較有問題?

this.id == "upright" 

X顯示出來,表示代碼的其餘部分工作,所以它必須是比較。讓我知道你的想法。

+0

使用'的console.log(this.id)'看到實際的價值是什麼,要知道任何空白的。 – adeneo

+0

@adeneo我試過這個,然後在chrome的控制檯開發工具中找到它,但它沒有出現在那裏,即使我點擊了它。思考? – ZAX

+0

您或者沒有包含jQuery,沒有帶類「.tictactoe」的元素,或者帶有「.tictactoe」類的元素沒有ID。 – adeneo

回答

3

在click處理函數中傳遞clickFunction。然後刪除函數中不必要的點擊處理程序。

$(document).ready(function(){ 
    $('#playagain').hide(); 
    $('.tictactoe td').on("click", clickFunction); //Added td click handler 
}); 

function clickFunction() 
{ 
    $(this).text("X"); 
    if(this.id == "upleft") 
    { 
     $('#upright').text("yes"); 
    } 
} 
+0

由於某種原因,這不起作用......它仍然只是打印x。我確認身份證號碼是正確的並且正確,並在適當時候有一個#,但它仍然不起作用 – ZAX

+0

您想要選擇您要單擊的「框」。但是,您要在整個tictactoe板上放置點擊處理程序。你的html如何設置? – KingKongFrog

+0

tic tac toe的網格是一個帶有適當邊框的表格。表中的每個「td」都有其位置標識,例如直立等,以及一類tictactoe。我看到你關於在整個網格上放置單個事件監聽器的觀點。那麼我怎樣才能改變我的代碼來在網格中的每個方格上放置一個監聽器呢? – ZAX

0

,如果您使用會發生什麼情況下面,而不是:

$(this).attr('id') == "upright"