设置“值”属性中包含空格的变量

setting a "value" attribute in html with a variable containing spaces

本文关键字:包含 空格 变量 属性 设置      更新时间:2023-09-26

我对HTML/JS非常陌生,所以如果这是一个基本问题,我很抱歉…我试着在网上查找这个问题,但找不到解决方案。

我使用一个JS代码来创建一个HTML。我试图设置一个"值"属性与var包含空格(字符串与空格)。当检查chrome中的值时,我可以看到字符串没有正确设置。

这是我的JS代码:
var templateArray = templateString.split("'t");
for (var i = 0; i < templateArray.length; i++) {
  htmlTemplate.push("<option value="+templateArray[i]+">"+templateArray[i]+"</option>");
}

templateArray:

templateArray[0] = template_member_information
templateArray[1] = template - member information

这是我在chrome中检查时得到的:

<option value="template" -="" member="" information="">template - member information</option>
<option value="template_member_information">template_member_information</option>

不要编写原始HTML,而是只存储值,然后动态创建DOM元素。

假设您拥有名为values的数组中的所有值,有这样的代码来填充具有这些值的项的下拉列表:(和等于该值的文本)

var oDDL = document.getElementById("MyDropDownList");
for (var i = 0; i < values.length; i++) {
    var option = new Option();
    option.value = option.text = values[i];
    oDDL.appendChild(option);
}

这样,你就不必在引号上乱来了,代码也更灵活了。

实时测试用例

为什么不直接把值放在引号之间呢?

htmlTemplate.push("<option value='""+templateArray[i]+"'">"+templateArray[i]+"</option>");

请注意,对于包含引号的值,这仍然会失败,但是失败的次数会减少。

你忘记加引号了:

var str = "<option value='"+templateArray[i]+"'>"+templateArray[i]+"</option>";
htmlTemplate.push(str);