下面的JavaScript給出了一個錯誤Uncaught TypeError: 不能讀取未定義的屬性（讀取'setAttribute'）和控制臺日志this.valid_form_submit_btn是未定義的，但這個函式之外的相同變數是可訪問的。
form-validation.js
"use strict"/span>。
//validation script
class MedValidation {
constructor(valid_form_id) {
this.valid_form = document.getElementById（valid_form_id）。
this.valid_form_submit_btn = this. valid_form.querySelector('[type="submit"]'/span>)。
}
init() {
this.valid_fv = FormValidation.formValidation(
this.valid_form, {
plugins: {
trigger: new FormValidation.plugins。 Trigger({delay:0.5})。
submitButton: new FormValidation.plugins.SubmitButton（）。
bootstrap: new FormValidation.plugins.Bootstrap（）。
icon: new FormValidation.plugins.Icon（{
valid: "fa fa-check"/span>,
無效。"fa fa-times",
validating: "fa-refresh"。
}),
fieldStatus: new FormValidation.plugins.FieldStatus（{
onStatusChanged: function (areFieldsValid) {
console.log（"test fieldStatus"）。
console.log（areFieldsValid）。
console.log（this.valid_form_submit_btn）。
if (areFieldsValid) {
//啟用提交按鈕。
//所以用戶有機會再次提交表單。
this.valid_form_submit_btn.removeAttribute（"disabled"）。
} else {
//禁用提交按鈕。
this.valid_form_submit_btn。 setAttribute("disabled", "disabled") 。
}
},
}),
},
});
}
}
//webpack支持
if （typeof module ! == "undefined" && typeof module.exports != == "undefined") {
module.exports = MedValidation;
}
如何向onStatusChanged函式傳遞變數？
uj5u.com熱心網友回復：
如果你不想失去this背景關系，你必須使用arrow函式而不是普通函式。
fieldStatus: new FormValidation.plugins.FieldStatus（ {
onStatusChanged: (areFieldsValid) => { // this.
console.log("test fieldStatus"/span>)。
console.log（areFieldsValid）。
console.log（this.valid_form_submit_btn）。
if (areFieldsValid) {
//啟用提交按鈕。
//所以用戶有機會再次提交表單。
this.valid_form_submit_btn。 removeAttribute("disabled"); // and now `this` context is MedValidation class.
} else {
// 禁用提交按鈕 {
this.valid_form_submit_btn。 setAttribute("disabled", "disabled") 。
}
},
})
很好的解釋這里
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/332805.html
標籤：