【发布时间】：2016-12-09 02:53:31
【问题描述】：
我目前一直在做一个词搜索器，但我遇到了一个问题。问题是我正在使用带有 contenteditable 的表，但是如何设置最大字符串长度。我已经试过了
maxlength="1"
谁能帮忙！
#editor {
background-color: turquoise;
}<table border="1" id="editor" width="500px" height="500px">
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
<tr>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
<td contenteditable="true"> </td>
</tr>
</table>运行到代码sn-p时，请全屏。
拜托，如果有什么办法，请尽量避免使用jquery！
【问题讨论】：
-
您当然可以创建一个更小的示例？ （12x12 的桌子向我们展示了 4x4 的桌子不会显示什么？）
-
我真的不认为
contenteditable是去这里的方式。如果您想要输入的行为（例如maxlength属性），请使用输入。 -
@Corey Ogbum 我已经尝试过了，但我没有运气，因为宽度和高度不会跟随我尝试的 css。虽然现在，我有点放弃了。
标签： javascript html string html-table maxlength