Question

我不想删除滚动条。我希望它在那里表明滚动更多，但即使他们拖动滚动条我想阻止页面形式移动（直到特定事件发生）。我该怎么做？

这不起作用：

/* This does NOT stop the page form moving when the drag the scrollbar */
document.addEventListener( "scroll", function(event) {
     console.log( "scrolled");
     event.preventDefault(); 
     event.stopPropagation();
     return false;
  },
  false
);

https://jsfiddle.net/4atyw01h/

Answer 1

刚刚发现了一个可能的答案（可行）：除了防止默认，传播之外，您还需要将元素scrollTop设置为0（或者您想要锁定它的任何地方）：

document.addEventListener( "scroll", function(event) {
     console.log( "scrolled");
     event.preventDefault(); 
     event.stopPropagation();

     //This stops it
     document.body.scrollTop = 0;

     return false;
  },
  false
);

https://jsfiddle.net/4atyw01h/1/

Answer 2

无需调用constructor(...args) { super(...args) this.state = { currentSize: 5 } } get items() { pastTrackers.slice(0, this.state.currentSize) } this.addFive() { this.setState({ currentSize: this.state.currentSize + 5 }) } render(){ return( {this.items.map((pastTracker,index)=>{ return( <li>LIST ITEM</li> ) })} <Button onClick={() => { this.addFive() }}>Show 5 More</Button> })和event.preventDefault()方法。 event.stopPropagation()分配就足够了。调用document.body.scrollTop = 0以防止滚动整个文档。我在Chrome中测试过。

如何防止用户拖动滚动条移动页面？

2 个答案: