如何使用JavaScript中的onclick在函數中更改對象屬性

我是編程新手，我正在嘗試做一些對我來說有些過度挑戰的事情，所以對此有所幫助。如何使用JavaScript中的onclick在函數中更改對象屬性

我想在顯示棋類遊戲的網站上使用Canvas Chess PGN viewer，使用戶可以瀏覽遊戲。我想爲一個不同的遊戲使用一個棋盤，所以我正在嘗試創建onclick事件來改變棋盤腳本中的源屬性值並使腳本再次運行，但我無法弄清楚如何做到這一點。

它是應該通過點擊按鈕來改變的「pgn_uri」屬性，例如，當用戶點擊「Round2」而不是它變成「pgn_uri：secondGame」時，等等。具有CHESS.PgnViewer（）函數的腳本也應該再次運行，以便棋盤更新。

<button type="button" name="button" id="round1">Round1</button> 
<button type="button" name="button" id="round2">Round2</button> 
<button type="button" name="button" id="round3">Round3</button> 

<script src="canvaschess\canvaschess-0.1.0.min.js"></script> 
<script src="canvaschess\pgnviewer-0.1.0.min.js"></script> 

<script type="text/javascript"> 
var firstGame = 'canvaschess/pgns/round1.pgn'; 
var secondGame = 'canvaschess/pgns/round2.pgn'; 
var thirdGame = 'canvaschess/pgns/round3.pgn'; 
</script> 

<script> 
var viewer = new CHESS.PgnViewer({ 
pgn_uri: firstGame, 
square_color_dark: '#000', 
square_color_light: '#fff', 
square_uri_dark: 'canvaschess/img/themes/wood/square_dark.jpg', 
square_uri_light: 'canvaschess/img/themes/wood/square_light.jpg', 
show_labels: false, 
show_tags: true 
}); 
</script>

來源

2017-07-07 GaborHorvath

那麼你是否嘗試添加onclick事件......？ https://stackoverflow.com/a/23615917/6324080 –

嘗試添加的onclick事件如

保持可變說chessGame爲「全球性」和的onclick按鈕改變其值

$('#round2').onclick(function() 
{ 
chessGame ='secondGame'; 
});

，並通過「chessGame」而不是「firstGame」在新CHESS.PgnViewer

來源

2017-07-07 08:46:11 Sameer

在每個按鈕中添加點擊事件可能此代碼

// Assume you have global variable name game 
$('#btn1, #btn2, #btn3').on('click', function(){ 
    var btn_clicked = $(this).attr('id'); // get id value 
    switch (btn_clicked) { 
     case 'btn1': 
      game = 'canvaschess/pgns/round1.pgn'; 
      break; 
     case 'btn2': 
      game = 'canvaschess/pgns/round2.pgn'; 
      break; 
     case 'btn3': 
      game = 'canvaschess/pgns/round3.pgn'; 
      break; 
    } 
});

現在，您可以全局變量傳遞給新CHESS.PgnViewer

注：我沒有測試此代碼呵呵呵！

來源

2017-07-07 09:01:41

如何使用JavaScript中的onclick在函數中更改對象屬性

回答

相關問題