javascript - 用函数在js中写html

标签 javascript html css syntax-error

<分区>


关闭 4 年前

我对 innerHTML 和 onclick 有问题...

我收到此错误:意外语法错误:参数列表后缺少 )

问题是:

let parent = document.getElementById("parent");
let a, b;

function addDivs(){
  a = 5;
  b = 7;
  parent.innerHTML += "<div onclick='callFunc("+a+","+b+")'></div>";
}

function callFunc(x, y){
  console.log(x+y);
}
<div id="parent">

</div>

最佳答案

您发布的代码中的主要问题是没有将调用 addDivs() 的点击事件附加到父级 div,当您修复它时一切正常,附加使用 addEventListener() 的事件,例如:

let parent = document.getElementById("parent");
let a, b;

parent.addEventListener('click', addDivs, false);

function addDivs() {
  a = 5;
  b = 7;
  parent.innerHTML += "<div onclick='callFunc(" + a + "," + b + ")'>NEW DIV</div>";
}

function callFunc(x, y) {
  console.log(x + y);
}
<div id="parent">PARENT DIV</div>

关于javascript - 用函数在js中写html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52985564/

上一篇:javascript - 如何用js/jquery一个接一个地加载html页面?

下一篇:html - 导航栏在移动设备上折叠时背景正文向上滚动

相关文章:

javascript - 使用 lodash 使用一些更新和删除的结果更新数组的最佳方法是什么?

javascript - 三.js TypeError : 'global' is undefined in Firefox

javascript - 我如何防止 bower 下载整个 repo 协议(protocol)

html - 显示需要重复但没有重复模式的背景图像

html - 导航栏的文字颜色没有改变

html - 纯CSS解决div堆叠列

html - Internet Explorer 7 float 列表元素

javascript - 延迟 promise 值未更新/解析/延迟

html - 当我无法使用 css 时,如何设置设备特定的视口(viewport)宽度?

css - 将鼠标悬停在一个 DIV 上以缩放另一个 DIV