我对 javascript 真的很陌生,并试图验证一个页面到 xhtml 过渡。我使用 onselectstart="return false"
所以我知道我想创建一个 javascript 函数,将其作为 id 插入。我什至发现了这个http://www.webmasterworld.com/javascript/3054096.htm 并且他想出了如何去做。
他正在将 onload 放入 body 并设置 id。我可以在课堂上做到这一点而不设置特定的 ID 号吗?
我对 javascript 真的很陌生,并试图验证一个页面到 xhtml 过渡。我使用 onselectstart="return false"
所以我知道我想创建一个 javascript 函数,将其作为 id 插入。我什至发现了这个http://www.webmasterworld.com/javascript/3054096.htm 并且他想出了如何去做。
他正在将 onload 放入 body 并设置 id。我可以在课堂上做到这一点而不设置特定的 ID 号吗?
您可以使用该document.getElementsByClassName
方法,但它还不是标准的(它将成为HTML5的一部分),您可以完全确定它不适用于任何IE版本,一些现代浏览器提供了本机实现,但如果它不是可用时,可以对您要查找的特定类进行循环检查。
我个人使用以下函数,灵感来自Dustin Diaz实现:
function getElementsByClassName(node,classname) {
if (node.getElementsByClassName) { // use native implementation if available
return node.getElementsByClassName(classname);
} else {
return (function getElementsByClass(searchClass,node) {
if ( node == null )
node = document;
var classElements = [],
els = node.getElementsByTagName("*"),
elsLen = els.length,
pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"), i, j;
for (i = 0, j = 0; i < elsLen; i++) {
if ( pattern.test(els[i].className) ) {
classElements[j] = els[i];
j++;
}
}
return classElements;
})(classname, node);
}
}
然后你可以像这样使用它:
window.onload = function () {
var returnFalse = function () { return false; },
els = getElementsByClassName(document, 'yourClassName'),
n = els.length;
while (n--) {
els[n].onselectstart = returnFalse;
}
};
编辑- 这个修改后的答案将我之前的答案与 CMS 提供的答案结合在一起。
此代码适用于 IE 6/7/8:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test page</title>
<script type="text/javascript" language="javascript">
window.onload = function() {
var elements = getElementsByClassName(document, 'noselect');
for (var i = 0; i < elements.length; i++) {
elements[i].attachEvent('onselectstart', rfalse);
}
}
function rfalse() { return false; }
function getElementsByClassName(node, classname) {
if (node.getElementsByClassName) { // use native implementation if available
return node.getElementsByClassName(classname);
} else {
return (function getElementsByClass(searchClass, node) {
if (node == null)
node = document;
var classElements = [],
els = node.getElementsByTagName("*"),
elsLen = els.length,
pattern = new RegExp("(^|\\s)" + searchClass + "(\\s|$)"), i, j;
for (i = 0, j = 0; i < elsLen; i++) {
if (pattern.test(els[i].className)) {
classElements[j] = els[i];
j++;
}
}
return classElements;
})(classname, node);
}
}
</script>
</head>
<body>
<h2 class='noselect'>
this text cannot be selected
</h2>
<h2>
this text can be selected
</h2>
<h2 class='noselect'>
this text cannot be selected
</h2>
</body>
</html>
上述解决方案都不适合我——尽管我确信这是由于用户错误造成的。我们已经运行了 Jquery,结果证明它们已经为此设置好了。我们在 head 部分使用了这段代码,效果很好!
<script language="javascript" type="text/javascript">
$(document).ready(function() {
//alert($(".unselectable").length)
var returnFalse = function () { return false; },
els = $(".yourClassNameHere"),
n = els.length;
while (n--) {
els[n].onselectstart = returnFalse;
}
});
</script>