<分区>
标签 javascript html css
<分区>
我正在开发一个 webapp 来复制 onclick 文本,但是 javascript 连接我的字符串的方式形成了 li html 元素,它正在用我的元素选择器中的“”替换“”,这破坏了我的功能。我尝试用字符串转义替换,但无济于事。
我的注释掉的 html 是一个工作功能的例子,也是我打算做的事情。
var responseList = [
'Text',
'also text',
'Some text!',
'Some more text..'
];
var concatHTML = '';
var concatHTML2 = [];
function print(message, i) {
concatHTML += '\r<li>' + '<p id=\"p' + i + '\" onclick=\'copyToClipboard(\"#p' + i +"\')\'>" + message + "</p>\r";
console.log(concatHTML);
document.getElementById("respUL").innerHTML = concatHTML;
}
for (var i = 0; i < responseList.length; i++) {
print(responseList[i], i);
}
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
<link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="container">
<h1>Click & Paste</h1>
<h2>Making a list of things to click on then paste</h2>
<ul id="respUL">
</ul>
<!-- <p id="p1" onclick="copyToClipboard('#p1')">Text
</p>
<p id="p2" onclick="copyToClipboard('#p2')">Hi, I'm the 2nd TEXT</p><br/> -->
</div>
最佳答案
如果您停止使用 innerHTML
并创建所需的 DOM 节点,这应该相当容易:
function print(message, i) {
var li = document.createElement('li');
var p = document.createElement('p');
p.id = i;
p.addEventListener('click', function(event) {
copyToClipboard("#p"+i);
}, false);
p.textContent = message;
li.appendChild(p);
document.getElementById("respUL").appendChild(li);
}
关于javascript - 在连接期间保持双引号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43616777/
相关文章:
javascript - 从 Chrome 扩展弹出窗口中获取值(value)
php - 调用在另一个 <div> 中返回一个 <div> 的 php 自定义函数
jquery - 使用 div 进行类似表格的布局,如何使用 CSS 或 jQuery 突出显示某些 div
javascript - 你能在 three.js 场景之间共享网格吗?
javascript - 是否可以在Electron中过滤URL?
javascript - 在 HTML 文件内的图像上创建十字
javascript - 我应该将 '[]' 附加到多个 html 复选框吗?