JavaScript：onClick 事件无需触发即可工作

Question

我正在修改从互联网上某处获取的模板。 到这里，分页就完成了。 结束页面将有表单提交。 我试图在不影响任何 CSS 的情况下对其进行修改。 所以我没有将标签更改为按钮。 我正在使用带有 onClick 事件的锚标记，该事件将提交表单。 但是 onClick 事件在页面加载而不是 onClicking 上起作用。

function renderPagination(wizard, options, state) {
  if (options.enablePagination) {
    var pagination = "<{0} class=\"actions {1}\"><ul role=\"menu\" aria-label=\"{2}\">{3}</ul></{0}>",
      buttonTemplate = "<li><a href=\"#{0}\" role=\"menuitem\">{1}</a></li>",
      submitButtonTemplate = "<li><a href = \'#{0}\' onClick=" + document.getElementById('studentForm').submit() + " role=\"menuitem\">{1}</a></li>",
      buttons = "";

    if (!options.forceMoveForward) {
      buttons += buttonTemplate.format("previous", options.labels.previous);
    }

    buttons += buttonTemplate.format("next", options.labels.next);

    if (options.enableFinishButton) {
      buttons += buttonTemplate.format("finish", options.labels.finish);
    }

    if (options.enableCancelButton) {
      buttons += buttonTemplate.format("cancel", options.labels.cancel);
    }

    wizard.append(pagination.format(options.actionContainerTag, options.clearFixCssClass,
      options.labels.pagination, buttons));

    refreshPagination(wizard, options, state);
    loadAsyncContent(wizard, options, state);
  }
}

Answer 1

您实际上并没有将要执行的 JS 传递到字符串模板中，您实际上是在执行该 JS 并将该执行的toString结果插入到模板中，您的变量分配应该是：

      submitButtonTemplate = "<li><a href = \'#{0}\' onClick=" + "\"document.getElementById('studentForm').submit()\"" + " role=\"menuitem\">{1}</a></li>",