Question

在我的拼写游戏中，新单词会一直添加，所以总会有新的拼写单词选择。

添加到游戏中的每个单词都有一个“src”图像和一个声音，提示用户在游戏中获得正确的拼写。

当我完成游戏制作时，添加新单词的工作取决于我的一位同事。这意味着他将不得不为图片和音频以及单词添加链接。

由于他们对这类事情知之甚少，我想尽量让他在添加单词时添加图像和声音，我想创建一个默认路径到共享位置，在那里他将存储所有这个东西。

通过这种方式，他可以输入单词“bug”，图片中输入“.bug-pic”，声音输入“.bug-audio”，这样他就可以轻松添加到HTML中。

这是最好的方法吗？

他们输入这些东西的最简单方法是什么？

这是我现在存储单词，声音和图像的方式......

Answer 1

因此，带有'点亮'字母表示拼写单词的表格是我们想要解决的问题，对吧？

你希望单词“换行”到该表的宽度？

我看到你正在从每个<td> s'data-word ='属性中获取数据 - 您可以轻松地将其归因于html5中的div。它有一个特殊的原因必须是一张桌子吗？否则，您可以使用具有固定宽度的包装器div并将<td> s替换为子div设置为float：left - 无论最后一行是否与任何字母相关，这些都将自动“换行”给定的单词 - 也就是说，它会在新的行中打破单词。

<style>
    .letters_wrap{
        width:500px;
        height:auto;
        ...
     }

     .letter{
        width:50px;
        height:50px;
        float:left;
        ...
    }

</style>

<div class="letters_wrap">
    <div class="letter" id="letter_1" data-word="shin">s</div>
    <div class="letter" id="letter_1" data-word="shin">h</div>
    <div class="letter" id="letter_1" data-word="shin">i</div>
    <div class="letter" id="letter_1" data-word="shin">n</div>
</div>

让我知道，如果我至少得到了正确的结果，那么探索是什么以及你想要实现的目标。

取值

<强>更新

@ m0onio - 在演示页面中，我绑定了将php文件（以及单词列表）加载到按钮的功能。

你可以在$(document).ready(){}函数中执行函数execute，一旦DOM可用，使得包含单词列表的javascript数组可用。

您需要编写一个javascript函数（包含在结束</body>标记之前）来处理网格中子div的构造，并从加载php的.load（）的回调函数中调用它文件（wordlist）。

要附加声音和图像，我还会在txt文件中包含该信息，以便运行该文件的内容：图像文件名|声音文件名然后当您循环通过数组时，您知道每个第一个元素是单词，第二个是相关图像，第三个是声音文件等。然后使用jquery将结果元素（子div）附加到它的父容器。有意义吗？

通过PHP向游戏添加单词

1 个答案: