我正在尝试编写我的网站代码,以便用户可以选择多个选项,而无需按住ctrl
。我有一个当前的解决方案,让我选择多个选项,但似乎每当我选择一个选项在我的窗口下的默认尺寸的方块,滚动跳回到顶部。
我已经找到了this solution,但是很多更可靠的答案似乎在JQuery中,但是我想坚持使用普通的JS。页面下方提供的纯JS解决方案给了我一个关于element
部分未定义的错误,这是为什么?
element.onmousedown= function(event) {
//this == event.target
event.preventDefault();
var scroll_offset= this.parentElement.scrollTop;
this.selected= !this.selected;
this.parentElement.scrollTop= scroll_offset;
}
element.onmousemove= function(event) {
event.preventDefault();
}
这是我现在使用的代码
window.onmousedown = function (e) {
var el = e.target;
if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) {
e.preventDefault();
// toggle selection
if (el.hasAttribute('selected')) el.removeAttribute('selected');
else el.setAttribute('selected', '');
}
}
我也看到过一些关于ScrollTop
的评论,但是每当我试图实现它时,我都会收到错误消息,说它没有定义。
这里有几个jsfiddles,它们模拟了我的目标,但是在JQuery中:
Example 1
Example 2
我对javascript的了解相当业余,所以我可能错过了这里明显的东西。任何帮助都将不胜感激。
1条答案
按热度按时间llmtgqce1#
纯粹的普通JS示例。
你应该像下面这样做。
我认为没有必要解释代码.这很简单