如何禁用后退按鈕瀏覽器

Question

有人可以幫我禁用后台瀏覽器功能需要什么代碼嗎？ 我想禁用它，因為當用戶使用它時，它會重置所有用戶條目並從頭開始返回。 我很菜鳥，所以你的幫助將不勝感激。

這只是我正在使用的代碼示例

非常感謝！

startTextHandler = async ()=>{
    await this.props.form.validateFields();
    let takerdetail = this.props.form.getFieldsValue();
    let uuid = window.location.pathname.split('/').slice(-1)[0];
    const params = {uuid:this.getUUID()};
    axios.get(`${env.url}/api/v1/test/validate-request`,{params}).then((res) => {
        if(res.data.success && (res.data.request.user === takerdetail.email || res.data.request.test_taker === null)){
        takerdetail.sponsor = res.data.request.sponsor;
        takerdetail.uuid = this.getUUID();
        console.log(takerdetail.uuid);
        this.props.dispatch(QuestionActions.setTakerDetail(takerdetail));
        this.props.history.push(`${this.props.location.pathname}/questions`.replace('//','/'));
        }
        else{
            this.props.form.validateFields((error, values) => {
                if (!error) {
                    this.props.form.setFields({
                        email: {
                            value: values.email,
                            errors: [new Error('Wrong email-id or test link')],
                        }
                    });
                } 
                else {
                  console.log('error', error, values);
                }
              });
        }

    }, (err) => {
        this.props.history.push('/');
    });

};
getUUID(){
    return window.location.pathname.match(/([0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12})/g)[0];
}
    render() {
        const { getFieldDecorator } = this.props.form;

        return (

                                            <div className="subtext">
                                              <Checkbox> I have read and I accept the
                                                  <a target="_blank" href="https://docs.wixstatic.com/ugd/3c785b_bbea80070bda4759bd96f7955b0ef891.pdf"> Terms of Use and Privacy Policy. </a>
                                                I agree that my participation in this personality profiling is voluntary and understand that
                                                my responses will be kept for the intended purposes.</Checkbox>
                                            </div>
                                        )}
                                    </Form.Item>
                                </div>
                                <div className="inputitems terms">

                                    <Form.Item>
                                        {/* <button onClick={this.startTextHandler} className="psButton">START THE TEST</button> */}
                                        <Button  onClick={this.startTextHandler} text={"START THE TEST"}/>
                                    </Form.Item>
                                </div>
                            </Form>
                        </div>
                    </div>
                </div>
            </div>
        )

    }
}
export default  connect()(withRouter(Form.create({ name: 'register' })(TakerDetail)));

Answer 1

通常，您不應禁用瀏覽器中的后退按鈕。

也就是說，您可能可以通過使用瀏覽器狀態來實現您的目標，以便在用戶輸入數據時創建新狀態，以便在用戶按下后退按鈕時將其彈回瀏覽器。

https://www.sitepoint.com/javascript-history-pushstate/

有關於如何操縱瀏覽器歷史記錄並向歷史記錄添加狀態的說明，以便用戶可以備份（例如）他們之前在您的頁面上輸入的內容。 （你只需要在你的代碼中創建允許這樣做的機制。）

Answer 2

從過去三天我一直在研究這個問題。 您無法禁用瀏覽器后退按鈕您會發現許多方法，例如刪除歷史記錄等。