javascript - Internet Explorer 错误 SCRIPT1014 无效字符`

Question

我有一些 JS 可以在除 IE 之外的所有浏览器中运行。

当我在该页面上打开控制台时，出现以下错误:SCRIPT1014:以下行中的字符无效:

const template = `

这是它中断的部分:

const template = `
<div class='row sortwrap'>
  <div class='col-md-8'>
    <input type='text' name='category[]' placeholder='' class='form-control name_list catinput' />
    <i class='mdi mdi-sort dragndrop'></i>
  <div class='questionlist questionwrap'>
    <div class='row'>
      <div class='col-md-8'>
        <button class='btn btn-success questionbutton'>Extra vraag</button>
        <input type='text' name='question[]' placeholder='1. Voeg een vraag toe' class='form-control name_list questioninput' />
      </div>
      <div class='col-md-4'>

      </div>
    </div>
    </div>
  </div>
  <div class='col-md-4'>
  <button id='addcategory' class='btn btn-danger btn_remove removebutton'>X</button>
  </div>
</div>`;

const vraagTemplate = `
<div class="row" id="question">
  <div class="col-md-8">
    <input type="text" name="question[]" class="form-control name_list questioninput" />
  </div>
  <div class="col-md-4">
    <button class="btn btn-danger btn_remove">X</button>
  </div>
</div>`;

我尝试使用 ' 或 " 但随后它也停止工作并收到此错误:

SCRIPT1015: Unterminated string constant

在同一条线上。

对此我能做什么？

我找到了这个答案:IE11 throwing "SCRIPT1014: invalid character" where all other browsers work但我拥有的一切都只是纯 HTML，更改引号不起作用。

Answer 1

简短回答:

IE 不支持模板文字!
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

所以你甚至不能使用 ` 来表示字符串。您需要对字符串使用普通的 ' 或双引号 "。如果字符串的内容也包含引号，您需要对它们进行转义。

请记住，默认情况下普通字符串不是多行的。这篇 SO 帖子中有更多详细信息:
Creating multiline strings in JavaScript

工作示例:

const vraagTemplate =
  '<div class="row" id="question">' +
  '  <div class="col-md-8">' +
  '    <input type="text" name="question[]" class="form-control name_list questioninput" />' +
  '  </div>' +
  '  <div class="col-md-4">' +
  '    <button class="btn btn-danger btn_remove">X</button>' +
  '  </div>' +
  '</div>';

console.log(vraagTemplate);

const vraagTemplate = ' \
<div class="row" id="question"> \
  <div class="col-md-8"> \
    <input type="text" name="question[]" class="form-control name_list questioninput" /> \
  </div> \
  <div class="col-md-4"> \
    <button class="btn btn-danger btn_remove">X</button> \
  </div> \
</div>';

console.log(vraagTemplate);