创建动态类名时，如何在 javascript 字符串中添加空格？答案

【问题标题】：How can I put whitespace in the javascript string when I make a dynamic class name?创建动态类名时，如何在 javascript 字符串中添加空格？
【发布时间】：2018-09-27 04:24:32
【问题描述】：

我在 ASP.NET MVC 中使用 Javascript。我需要动态生成包含空格的类名，但它不起作用。

结果变成

<script class="carousel-item" active="">

而不是

<script class="carousel-item active">

下面是代码块。

@for (var i = 0; i < Model.Banners.Count; i++)
{
                    var className = "carousel-item";
                    if (i == 0)
                    {
                        className += " active";
                    }

                    var srcName = "";
                    if (Model.Banners[i].Image != null)
                    {
                        srcName = "data:image;base64," + @System.Convert.ToBase64String(Model.Banners[i].Image);
                    }

                    <div class=@className>
                        <img class="d-block img-fluid" src=@srcName/>
                    </div>
}

【问题讨论】：

标签： javascript asp.net model-view-controller

【解决方案1】：

实际上，您缺少 html 属性的引号（“”），正确的 html 语法是 attr1="value1, value2"，并且您将其设置为 attr1=value1 value2。

试试：

<div class="@className">
    <img class="d-block img-fluid" src="@srcName"/>
</div>

或者：

var className = "\"carousel-item";
if (i == 0)
{
    className += " active";
}
className += "\"";

【讨论】：

【解决方案2】：

您在 <div class=@className> 中缺少围绕 @className 的引号，请改用 <div class="@className">。

您还应该在img 标记中为@srcName 添加引号

<div class="@className">
    <img class="d-block img-fluid" src="@srcName"/>
</div>

说明

没有引号 <div class="@className"> 将呈现

<div class=carousel-item active>

这被解释为

<div class="carousel-item" active="">

【讨论】：