Javascript 通过PHP向游戏中添加单词

在我的拼写游戏中，新单词会一直被添加，所以总是有新的单词可以拼写

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

当我完成游戏制作后，添加新单词的工作就落在我的一位同事身上了。这意味着他必须为图片和音频以及单词添加一个链接

由于他们对这类东西知之甚少，我想让他在添加单词时尽可能容易地添加图像和声音，我想创建一个默认路径，指向一个共享位置，在那里他将存储所有这些东西

这样他就可以输入“bug”作为单词，.bug pic作为图片，.bug audio作为声音，这样他就可以很容易地将其添加到HTML中

这是最好的方法吗

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

---

下面是我目前存储单词、声音和图像的方式…

因此，表中的字母“亮起”表示要拼写的单词是我们试图修复的位置，对吗

你想让文字“环绕”到那张桌子的宽度

我看到您正在从每个

s的“data word=”属性中提取数据，您可以很容易地将其归因于html5中的一个div。有什么特别的原因它必须是一张桌子吗？否则，您可以使用固定宽度的包装div，并将

s替换为子divs set 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>

.信的包装{
宽度：500px；
高度：自动；
...
}
.信{
宽度：50px；
高度：50px；
浮动：左；
...
}
s
H
我
N

让我知道，如果我至少掌握了正确的方向，那就是问题所在和你想要实现的目标

更新

@m0onio-在演示页面中，我将加载php文件（因此也就是单词列表）的函数绑定到一个按钮上

您将在

$（document）.ready（）{}

函数中执行该函数，使包含单词列表的javascript数组在DOM可用后可用

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

---

为了附加声音和图像，我将把这些信息也包括在txt文件中，这样文件的内容就会运行：word | image filename | sound filename，然后当你在数组中循环时，你知道每一个第一个元素都是单词，第二个是相关的图像，第三个是声音文件，等等。然后使用jquery附加结果元素（儿童版）到它的父容器。有意义吗？

您好。我已经看过JSFIDLE，但我正在努力重现这个问题，正如我从您的描述中了解到的。您能设置一个不包含随机选择的分叉并在每次运行时重现这个问题吗？我很高兴看一看，看看我们是否可以对它进行排序。随机生成是它的一部分不过他有一个问题。我想考虑一下它是否适合随机放置的位置。如果不适合，那就去其他地方。当我只使用3个字母的单词时，效果很好。@Scott Clarkt这很酷，但我不能完全理解这个问题。一旦解决了，你可以重新引入pr的随机元素ocess，不是吗？也许只有两种解决问题的方法——一个是3个字母的单词，另一个是触发问题的多个字母中的一个——然后当它们都起作用时，你可以重新包含整个“游戏”……这就是你想要的吗？听起来像我在寻找的。老实说，唯一的问题是你需要能够添加新单词通过html而不是通过script@ScottClark@m0onio-thru'html意味着有用户输入，然后需要编写脚本来处理输入的新数据（由用户或管理员？）.或者你的意思是新词必须硬编码到html中？与此同时，请尝试使用上面的div来构建它，然后添加新词，我们可以在下一步查看。我的意思是我的colegues将更新游戏。他们说他们希望通过html而不是脚本@Scott Clarkt来添加新词。这很模糊-说“通过html输入新单词”意味着将其写入html代码。为了你的缘故，我会向他们明确说明他们想要如何更新游戏。我的钱在……他们想要一个界面，即一个页面，他们可以编辑单词列表，然后“点击保存”，然后这些单词将成为游戏中的单词列表。所有这些都非常脚本化但是，从你的代码结构来看，一切都取决于

，因此这必须是动态可更新的元素，为将来的单词列表编辑提供一个UI。你使用mySql+php？-数据库显然可以做到。否则，你可以从一个txt文件加载所有变量-可能更简单-然后循环cre每个

。在任何一种情况下，“管理页面”都只允许查看列表、检查保留或删除、创建新项目等。然后使用脚本后端覆盖文本文件。