JavaScript:onClick 事件在不触发的情况下工作

Question

我正在修改从互联网上某处获取的模板。到这里，分页就完成了。最后一页将有表单提交。我试图在不影响任何 CSS 的情况下修改它。所以我没有将标签更改为按钮。我在将提交表单的 onClick 事件中使用 anchor 标记。但是 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>",