![](/img/trans.png)
[英]Passing multiple parameters to function using settAtribute “onclick” in Javascript?
[英]Passing multiple parameters to function using onclick
我正在做一个待办事项应用程序。 当我单击编辑按钮时,我想将项目ID和标题发送到editItem函数。 我在弄清楚如何使用模板字符串传递给参数时遇到麻烦。 当我只发送item.id时,它工作正常,但是当我添加第二个参数(item.title)时,出现错误
<button onclick='data.editItem(${item.id}, ${item.title})'class="editItem">Edit</button>
完整的代码
const data = new State()
data.mockData.map(item => {
let markup =` <li id="${item.id}"className={item.done ? 'done': 'hidden'}> ${item.title}
<button onclick='data.deleteItem(${item.id})'class="deleteItem" >Delete</button>
<button onclick='data.editItem(${item.id}${item.title})'class="editItem">Edit</button>
<button class="completeItem">Complete</button>
</li>
`
document.querySelector('ul').insertAdjacentHTML('beforeend', markup)
})
我知道这与您的方法略有不同,但是类似的方法对您有用吗?
<li id="item1">
Item1 Title
<button id="button1" onclick="handleClick(this.id)" class="editItem">
Edit
</button>
</li>
<script>
function editItem(id, title) {
console.log(id, title)
}
function handleClick(id) {
let clickedButton = document.getElementById(id);
let item1 = clickedButton.parentNode;
editItem(item1.id, item1.firstChild.textContent);
}
</script>
注意:我已经编辑了上面的代码,以进一步解决提问者的需求。
您可以尝试使用引号:
<button onclick='data.editItem(${item.id}, "${item.title}")'class="editItem">Edit</button>
我认为应该; <button onclick="editItem(item.id, item.title)" />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.