参考csdn论坛的问答,做动态添加button。javascript动态添加button,并添加onclick事件-CSDN社区
带我的人
let div = window.document.createElement('div')
div.innerHTML = `<input onclick="${Copy()"} type="button" value="复制" />`
//原来想用上面这行这个的,带我的人,不建议用,不动态,而且这个,他是先解析完动态的,解析出来undefined。
还有jquery的方法。let btn = $(`<button >copy</button>`)
<script type="text/javascript">
function CreatButton() {
var btn = document.createElement("input");
btn.type = "button";
btn.style.width = "80px";
btn.id = "submit";
btn.name = "submit";
btn.value = "发送";
btn.onclick = "submit()";
document.getElementById("mydiv").appendChild(btn);
}
function submit() {
alert("111");
}</script>
为什么点击生成的button没有反应呢?
在线急等,求大神帮忙!
答案:btn.onclick =submit; 或 btn.onclick = function () { submit(); };
失败代码:
// btn.onclick = function () { // navigator.clipboard.writeText(text) // .then(() => { // console.log('Text copied.'); // }) // .catch(() => { // console.log('Failed to copy text.'); // }); // // var textarea = document.createElement("textarea") // // textarea.value = text; // 修改文本框的内容 // // console.log(textarea,'textarea') // // debugger // // textarea.select(); // 选中文本 // // document.execCommand("copy"); // 执行浏览器复制命令 // alert("复制成功"); // } // btn.addEventListener('click', function() { // // var text = document.getElementById("text").innerText; // var input = document.createElement("input") // input.value = text; // 修改文本框的内容 // input.select(); // 选中文本 // document.execCommand("copy"); // 执行浏览器复制命令 // alert("复制成功"); // })
成功代码:
let btn = window.document.createElement('input')
btn.type = "button";
btn.style.width = "80px";
btn.value = "复制";
btn.addEventListener('click', () => {
navigator.clipboard.writeText(text)
})
if (!tip) {
parent.appendChild(btn)
}
参考:
JavaScript 中的复制粘贴操作_慕课手记 (imooc.com)
/** * 给表单某个字段下一行追加一个复制按钮 * @param {*} id 表单字段id,必填 * @param {*} cbtId 复制按钮id,必填 * @param {*} array 复制区域,必填 * @param {*} setId 将复制内容赋值给表单字段id */ window.addCBTN = function(id = '', cbtId = '', array, setId= '') { let tip = parent.querySelector(`[data-id=${tipsId}]`) let btn = window.document.createElement('input') btn.id = cbtId btn.type = "button"; btn.style.width = "80px"; btn.value = "复制"; btn.addEventListener('click', () => { let text = '' array.map(item => { let itemTarget =window.formData.find(i => i.ext_id === item) if(itemTarget.value){ text += itemTarget.cname +':'+itemTarget.value +'\n' } }) //这个if是如果有setId传进来,就赋值复制内容到这个id上 if (setId) { app_setValue(setId,text) } if (navigator.clipboard && window.isSecureContext) { return navigator.clipboard.writeText(text); } else { let textArea = document.createElement("textarea"); textArea.value = text; // 使text area不在viewport,同时设置不可见 textArea.style.position = "absolute"; textArea.style.opacity = 0; textArea.style.left = "-999999px"; textArea.style.top = "-999999px"; document.body.appendChild(textArea); textArea.focus(); textArea.select(); return new Promise((res, rej) => { // 执行复制命令并移除文本框 document.execCommand('copy') ? res() : rej(); textArea.remove(); }); } }) if (!tip) { parent.appendChild(btn) } }