使用 innerHTML 将 <select> 按钮插入 HTML 表格答案

【问题标题】：Inserting <select> button into HTML table using innerHTML使用 innerHTML 将 <select> 按钮插入 HTML 表格
【发布时间】：2012-09-19 16:52:58
【问题描述】：

我正在尝试在关联的 Javascript 函数中使用 .innerHTML 将输入按钮插入 HTML 表中。

每当我使用相同的 JS，但将“选择”替换为其他 HTML 时，它都可以正常工作。只有和

该问题至少出现在 IE、Firefox 和 Chrome 中。 Chrome 返回“意外标识符”错误。

缩写代码（不是原文）：

function newrow() {
    table = document.getElementById("Table");
    row = table.insertRow(1);
    cell = row.insertCell(0);
    cell.innerHTML = "<input id="Button" type="button" value="ClickHere" />";
};

我已经尝试用格式化文本（“Text”）和链接替换HTML，并且都正确显示。

我还在脚本之外创建了对象，这确实有效，但似乎没有必要：

<input id="Button" type="button" value="ClickHere" />

<script type="text/javascript">

function newrow() {
    table = document.getElementById("Table");
    button = document.getElementById("Button");
    row = table.insertRow(1);
    cell = row.insertCell(0);
    cell.innerHTML = button;
};

这行得通，但很笨拙，并且使我使用的任何“getindex”变得复杂。

任何帮助将不胜感激！

【问题讨论】：

带有 type="button" 的选择？
您知道"
不计算您发布的代码cell.innerHTML = "<select id="Button" type="button" value="ClickHere" />"; 中的主要语法错误，按钮没有'type="select"`。

标签： javascript html html-table innerhtml

【解决方案1】：

此行将触发“Unexpected Identifier”错误：

cell.innerHTML = "<input id="Button" type="button" value="ClickHere" />";

问题是你的报价。 JavaScript 解释器与用于表示 JavaScript 中的字符串的引号和 HTML 中使用的引号混淆了。您需要对字符串中的引号进行转义，或者出于某种目的使用单引号。

单引号可以：

cell.innerHTML = '<input id="Button" type="button" value="ClickHere" />';

或者，转义引号也可以：

cell.innerHTML = "<input id=\"Button\" type=\"button\" value=\"ClickHere\" />";

【讨论】：

谢谢！更改引号做到了！（很抱歉快速转录。应该小心在这里编写代码。实际代码确实有正确的标签。不知道“选择”是如何进入我的脑海的。）

【解决方案2】：

我认为您正在寻找<input type="button" /> 不选择也许？选择元素用于下拉菜单。

【讨论】：

哇！没想到反应这么快！这不是原始代码的直接副本——我在那里有“输入”。我的转录很差......
你仍然可以在输入中使用值标签，我只是懒惰打字。该值将是按钮上的文字。一个按钮是你想要的正确吗？
正确！我把我的代码转录到这里搞砸了——不知道为什么我把 select 改为。
引号是问题所在。看看斯蒂芬布赫的回答。