javascript: Tắt tính năng Chọn văn bản

Tôi đang sử dụng javascript để tắt lựa chọn văn bản trên webiste của mình.

Mã là:

<script type="text/JavaScript">

function disableselect(e) {
  return false
}

function reEnable() {
  return true
}

document.onselectstart = new Function ("return false")

if (window.sidebar) {
  document.onmousedown = disableselect
  document.onclick = reEnable
}
</script>

Tập lệnh tương tự có thể được tìm thấy ở đây

Trên máy chủ cục bộ của tôi: Tất cả các trình duyệt (Firefox, Chrome, IE và Safari) đều hoạt động tốt.

Trên trang Trực tiếp của tôi: Tất cả đều ổn TRỪ Firefox.

Câu hỏi của tôi là:

1. Có ai có gợi ý về lý do tại sao Firefox hoạt động khác nhau đối với trang web trực tiếp và máy chủ cục bộ không. Lưu ý: Javascript được bật.

2. Có lẽ tập lệnh của tôi quá đơn giản nên tôi đã thử cách sau với kết quả CHÍNH XÁC CÙNG

Chỉ cần sử dụng phương pháp css này:

body{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Bạn có thể tìm thấy câu trả lời tương tự ở đây: Làm cách nào để tắt tính năng đánh dấu vùng chọn văn bản bằng CSS?

Tôi đang viết điều khiển ui thanh trượt để cung cấp tính năng kéo, đây là cách của tôi để ngăn nội dung chọn khi người dùng đang kéo:

function disableSelect(event) {
    event.preventDefault();
}

function startDrag(event) {
    window.addEventListener('mouseup', onDragEnd);
    window.addEventListener('selectstart', disableSelect);
    // ... my other code
}

function onDragEnd() {
    window.removeEventListener('mouseup', onDragEnd);
    window.removeEventListener('selectstart', disableSelect);
    // ... my other code
}

ràng buộc startDragtrên dom của bạn:

<button onmousedown="startDrag">...</button>

Nếu bạn muốn vô hiệu hóa tĩnh chọn văn bản trên tất cả phần tử, hãy thực thi mã khi các phần tử được tải:

window.addEventListener('selectstart', function(e){ e.preventDefault(); });

      

Đối với JavaScript, hãy sử dụng hàm này:

function disableselect(e) {return false}
document.onselectstart = new Function (return false)
document.onmousedown = disableselect

để kích hoạt lựa chọn, hãy sử dụng cái này:

function reEnable() {return true}

và sử dụng chức năng này ở bất cứ đâu bạn muốn:

document.onclick = reEnable

Nếu bạn có một trang html như thế này:

    <cơ thể
    onbeforecopy = "return false"
    ondragstart = "return false" 
    onselectstart = "return false" 
    oncontextmenu = "return false" 
    onselect = "document.selection.empty ()" 
    oncopy = "document.selection.empty ()">

Có một cách đơn giản để tắt tất cả các sự kiện:

document.write(document.body.innerHTML)

Bạn có nội dung html và mất những thứ khác.

Một cũng có thể sử dụng, hoạt động tốt trong tất cả các trình duyệt, yêu cầu javascript:

onselectstart = (e) => {e.preventDefault()}

Thí dụ:

onselectstart = (e) => {
  e.preventDefault()
  console.log("nope!")
  }

Select me!

Một giải pháp thay thế js khác, bằng cách kiểm tra hỗ trợ CSS và vô hiệu hóa userSelect, hoặc MozUserSelectcho Firefox.

let FF
if (CSS.supports("( -moz-user-select: none )")){FF = 1} else {FF = 0}
(FF===1) ? document.body.style.MozUserSelect="none" : document.body.style.userSelect="none"

Select me!

Css thuần túy, cùng logic. Cảnh báo rằng bạn sẽ phải mở rộng các quy tắc đó cho mọi trình duyệt, điều này có thể dài dòng.

@supports (user-select:none) {
  div {
    user-select:none
  }
}

@supports (-moz-user-select:none) {
  div {
    -moz-user-select:none
  }
}

<div>Select me!</div>

Đơn giản Sao chép văn bản này và đặt trước </body>

function disableselect(e) {
  return false
}

function reEnable() {
  return true
}

document.onselectstart = new Function ("return false")

if (window.sidebar) {
  document.onmousedown = disableselect
  document.onclick = reEnable
}