Question

如下所示，我有一个循环，在其中创建一些ASP标签。

function func(val) {
    var mod = Math.ceil(val / 9);
    for (var i = 0; i < mod; i++) {
        html = '<div class="carousel-item">
                  <table>
                    <tr>
                      <td>Temp ' + parseInt(i * 9 + 1) + '</td>
                      <td>Temp  ' + parseInt(i * 9 + 2) + '</td>
                      <td>Temp  ' + parseInt(i * 9 + 3) + '</td>
                    </tr>
                    <tr>
                      <td><asp:Label ID="TempCL1" runat="server" Text="xxx"></asp:Label></td>
                      <td><asp:Label ID="TempCL2" runat="server" Text="xxx"></asp:Label></td>
                      <td><asp:Label ID="TempCL3" runat="server" Text="xxx"></asp:Label></td>
                    </tr>
                  </table>
                </div>';

              $(".carousel-inner").html($(".carousel-inner").html() + html);
        }
    }

我的代码工作正常，但是我需要修改标签ID。例如：来自

'<tr><td class="Valorppal"><asp:Label ID="TempCL1" runat="server" Text="xxx"></asp:Label></td>'

类似

'<tr><td class="Valorppal"><asp:Label ID="TempCL' + parseInt(i * 9 + 1) + '" runat="server" Text="xxx"></asp:Label></td>'

但是我得到了一个错误（“ TempCL” + parseInt（i * 9 +1）+'”不是有效的标识符。）

Answer 1

看来您没有真正的理由使用<asp:Label>，所以我用<span>标签代替了它们。

我还在长行html字符串的每一行末尾添加了\，这是在Java中用常规引号作为分隔符创建多行字符串文字所必需的。

最后，我使用jQuery .append()完成了您的工作，同时可读性更高。

工作代码，至少在您提供的部分中有效：

function func(val) {
    var mod = Math.ceil(val / 9);
    for (var i = 0; i < mod; i++) {
        var html =
'<div class="carousel-item">\
  <table>\
    <tr>\
      <td>Temp ' + (i * 9 + 1) + '</td>\
      <td>Temp ' + (i * 9 + 2) + '</td>\
      <td>Temp ' + (i * 9 + 3) + '</td>\
    </tr>\
    <tr>\
      <td><span id="TempCL' + (i * 9 + 1) + '">xxx</span></td>\
      <td><span id="TempCL' + (i * 9 + 2) + '">xxx</span></td>\
      <td><span id="TempCL' + (i * 9 + 3) + '">xxx</span></td>\
    </tr>\
  </table>\
</div>';
        $(".carousel-inner").append(html);
    }
}

func(23);

td { border: solid 1px green; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="carousel-inner"></div>

Answer 2

parseInt函数接受一个字符串并返回一个int。参见：This page

在没有parseInt的情况下尝试，应该可以正常工作。

Answer 3

也请如下使asp：label的ID动态化：-

<asp:Label ID="TempCL'+parseInt(i * 9 + 2)+'" runat="server" Text="xxx"></asp:Label>

希望它能起作用！

如何在JavaScript中动态设置ASP元素ID

3 个答案: