Estoy creando un sitio web que gira en torno al ajedrez e incorporando tableros de ajedrez interactivos usando la biblioteca chessboard.js .

Estoy tratando de crear una función que indique si el tablero de ajedrez está en una posición específica que se llama cuando se presiona un botón HTML a través de alertas del navegador. El problema es que la alerta apareció cuando se carga la página web pero no cuando se presiona el botón. Aquí está el código:

 <div id="board1" style="width: 400px"></div> <button id="clearButton">Clear Board</button> <button id="checkAnswer">Check Answer</button> <button id="showSolution">Show Solution</button> <script> var board = Chessboard('board1', { draggable: true, dropOffBoard: 'trash', sparePieces: true }) $('#clearButton').on('click', board.clear) $('#showSolution').on('click', board.start) $('#checkAnswer').on('click', checkAnswer()) function checkAnswer() { if (board.position == 'start') { alert('The board is in the start position'); } else { alert('The board is not in the start position') } } </script>