我对JavaScript不是很熟悉,我想使用chessboard.js库,但是渲染的棋盘不显示棋子(只显示棋盘),我做了下面推荐的完全相同的事情:How do I use chessboard.js , a javascript chessboard?
我的代码如下所示:
<html>
<head>
<title>Test chessboard.js</title>
<link rel="stylesheet" href="chessboardjs-1.0.0/css/chessboard-1.0.0.css">
</head>
<body>
<div id="myBoard" style="width: 400px"></div>
<script src="jquery-3.6.3/jquery-3.6.3.js"></script>
<script src="chessboardjs-1.0.0/js/chessboard-1.0.0.js"></script>
<script>
var ruyLopez = 'r1bqkbnr/pppp1ppp/2n5/1B2p3/4P3/5N2/PPPP1PPP/RNBQK2R'
var board = Chessboard('myBoard', ruyLopez)
</script>
</body>
</html>
我哪里做错了?
2条答案
按热度按时间juud5qan1#
你需要在本地复制棋子。
从
到您当地
然后,此示例HTML可以看到由于所有片段img
src
链接的相关位置而引起的问题示例
开始示例HTML
我用Live Server运行VS代码中的HTML本地服务器扩展。
你可以在这里找到所有的例子
here
here
oxf4rvwz2#
我终于解决了这个问题。我不得不把我的index.html与问题中发布的代码一起移动到文件夹chessboardjs-1.0.0然后我还需要更新index.html中的路径,如下所示:
或者保持一切原样,在chessboard-1.0.0.js中更改线
到
然而,我发现奇怪的是,.js文件并不解释相对于其自身位置的相对路径。