禁止選取頁面上的內容

Jan 5th, 2018

: CSS JS

.class {
  /* Firefox */
  -moz-user-select: none;
}
/* 在chrome中實現，通過-webkit-user-select: none;  如下： */
.class {
  /* Chrome */
  -webkit-user-select: none;
  user-select: none;
}

在ie中實現，直接給相關元素加上unselectable="on" ，如下：

<span unselectable="on" ></span>

使用Javascript代碼，如果要讓頁面中的某些動作可以正常運作，例如拖曳。
在動作開始前執行下面的 JavaScript ，把使用者選取關閉︰

document.onselectstart = function() { return false; }
document.body.style.MozUserSelect = 'none';
// 再在動作結束時執行下面的 JavaScript ，把使用者選取開啟︰
document.onselectstart = null;
document.body.style.MozUserSelect = '';

Loading