Question

$('#attachments').append("<tr><td><b>Attachment " + next + "</b><input id='upload" + next + "'name='files'" + "onchange='showUpload('" + next + "') type='file' value='System.Collections.Generic.List`1[System.Web.HttpPostedFileBase]'></td></tr>");

以上代码在浏览器中打印以下内容。我做错了什么？

<input id="upload1" name="files" onchange="showUpload(" 1') type="file" value="System.Collections.Generic.List`1[System.Web.HttpPostedFileBase]" class="valid" aria-invalid="false">

onchange="showUpload(" 1')必须为onchange="showUpload('1')

Answer 1

我建议改用string interpolation (template literals)。要了解您的浏览器是否支持模板文字，请查看Can I Use。

要做到这一点要容易得多。我添加了新行，因此它具有可读性。像这样将HTML放在一行上是不可能阅读的：

0000029: 00                                        ; section code
000002a: 00                                        ; section size (guess)
000002b: 04                                        ; string length
000002c: 6e61 6d65                                name  ; custom section name
0000030: 01                                        ; function name type
0000031: 00                                        ; subsection size (guess)
0000032: 01                                        ; num functions
0000033: 00                                        ; function index
0000034: 06                                        ; string length
0000035: 6164 6454 776f                           test  ; func name 0
0000031: 09                                        ; FIXUP subsection size
000003b: 02                                        ; local name type
000003c: 00                                        ; subsection size (guess)
000003d: 01                                        ; num functions
000003e: 00                                        ; function index
000003f: 01                                        ; num locals
0000040: 00                                        ; local index
0000041: 00                                        ; string length
000003c: 05                                        ; FIXUP subsection size
000002a: 17                                        ; FIXUP section size

这样做非常直观：由反引号描述的模板文字将用var content = `<tr><td> <b>Attachment ${next}</b> <input id="upload${next}" name="files" onchange="showUpload('${next}')" type="file" value="snipped for brevity"> </td></tr>`; $('#attachments').append(content);变量中的值替换${next}的每个实例。

我还冒昧地改变所有属性以使用双引号来保持一致性。希望我没有做任何拼写错误。

Answer 2

表面"onchange='showUpload('"关闭函数参数前的onchange值，这会导致HTML格式错误。

我做错了什么？

你真正做错的是你正在使用jQuery添加内联事件处理程序，这会导致类似的问题。

var tr = $("<tr><td><b>Attachment " + next + "</b></td></tr>").appendTo("#attachments");

$('<input>', {
  id: "upload" + next,
  name: "files",
  type: "file",
  value: "System.Collections.Generic.List`1[System.Web.HttpPostedFileBase]"
}).on( 'change', function() { showUpload(next); } )
  .appendTo(tr.find('td'));

Answer 3

您可以简单地转义角色

    $('#attachments')
  .append("<tr><td><b>Attachment " + next + "</b><input id='upload" + next + "' name='files'  onchange='showUpload(\"" + next + "\")' type='file' value='System.Collections.Generic.List`1[System.Web.HttpPostedFileBase]'></td></tr>");

在字符串中间变量

3 个答案: