javascript - Issues about disabling text selection and copying
The style is as follows
.test1 {
user-select: none;
}
html structure is as follows
<body>
<p class="content">
<p class="test2">111</p>
<p class="test1">222</p>
<p class="test2">333</p>
<p class="test1">444</p>
<p class="test2">555</p>
</p>
</body> We have disabled this article selection for some of the items. When selecting an item individually, the selection can indeed be disabled, and the content cannot be copied. However, if you use cmd a to select all, You will see that the disabled items are not selected on the page, but the content can be copied at this time.
Next use js to control:
[].forEach.call(document.querySelectorAll('.test1'), (node) => {
node.addEventListener('copy', (e) => {
e.stopPropagation();
e.preventDefault();
console.log(1);
return false;
}, true);
node.addEventListener('selectstart', (e) => {
e.stopPropagation();
e.preventDefault();
console.log(2);
return false;
}, true);
});I found that it still takes effect when selecting individually, but it fails when selecting all. So I would like to ask if there is any way to intersperse unselectable nodes among the selectable nodes, and also make it possible to select only the selected nodes when copying. Optional content.
