使用JQuery的Javascript作用域

我很难理解为什么会发生这种情况。以下是我的代码的简化版本：

$( document ).ready(function() {

  var mFormHelper = new FormHelper("form_add_ftransaction");
  var mThing = $("#mThing");

  form_add_ftransaction.submit(function(event){

    //var mFormHelper = new FormHelper("form_add_ftransaction"); <-- unless i uncomment this it doesn't seem to work

    var mloader = new Loader();

    mloader.setLoading(mThing);//<----- mThing is available in scope...

    mFormHelper.clearForm(); //<-------doesn't work unless mFormHelper is redeclared. Why not?

  });
});

为什么变量“mThing”可以在jQuery.submitfunction{}中访问，而“mFormHelper”不能访问

如果不重新声明mFormHelper，则会出现未捕获类型错误：无法读取未定义的属性“find”

FormHelper类是：

function FormHelper(formId){
    context = this;  //<--------------------------THIS WAS THE PROBLEM
    this.form = $("#"+formId);
    this.validate = function(){
        var valid = true;
        var requiredFields = context.form.find(".required");

        requiredFields.each(function(){
            $(this).removeClass("form_highlight");
            var field = $(this);
            if(field.attr("type") !=""){
                field.type = field.attr("type");
            }
            //alert(field.attr("data-type"));
            if(field.attr("data-type") == "radiogroup"){
                if(field.find("input:checked").get() ==""){

                    field.addClass("form_highlight");
                    valid = false;
                    return true;
                }
            }
            if((field.val() == "" || field.val() == null) && field.attr("data-type") != "radiogroup"){

                field.addClass("form_highlight");
                valid = false;
            }


        });
        return valid;
    };
/**
 * Method markRequiredFields
 *
 * Adds an asterisk in front of label for all required fields in the form. required fields are noted with the '.required' class.
 */
this.markRequiredFields = function(){
    var requiredFields = context.form.find(".required");
    requiredFields.each(function(){
        field = $(this);
        var label = $("label[for='"+field.attr('id')+"'");
        var str = label.html();
        if(str != undefined){
            label.html("*"+str.replace("*", ""));
        }

    });
}
this.clearForm = function (){
        this.form.find(':input').not(':button, :submit, :reset, :hidden, :checkbox, :radio').val('');
        this.form.find(':checkbox, :radio').prop('checked', false);
        this.form.removeAttr("class", "form_highlight");

}

---

}

因此，在您有用的评论指示我应该在范围内之后，我解决了这个问题

在我以前的帮助课程中，问题是：

function FormHelper(formId){
    context = this;  //<-------THIS WAS THE PROBLEM
    this.form = $("#"+formId);
    this.validate = function(){
        $valid = true;
    .......

总是那么简单

---

谢谢各位。

嗯，在那个例子中，它在范围内。您是否收到错误消息，说mFormHelper不在范围内？因为它似乎是。看来还有别的事情在发生。您在控制台中遇到了什么错误？我刚刚在问题中添加了一些内容。如果没有重新声明mFormHelper，则会出现未捕获类型错误：无法读取未定义的属性“find”。find在方法中调用。clearForm.this.form是DOM节点，而不是jQuery集合。请查看未简化的代码。必须为form_add_ftransaction.Chris分配一些内容，您同样需要var field=。。。在一些地方。而且上下文并不是真正需要的。它只用于context.form，所以分配var$form=$+formId；取而代之的是，将context.form全部替换为$form；是为了在课堂之外我可以访问itex。mFormHelper.form，如果我将其赋值为var$form=$+formId；在FormHelper类中，我是否错误地认为我无法访问$form变量？还有我声明变量context=this的原因；这是因为在一个方法中，它并没有引用我想要的内容。我肯定会接受更好的方法。我对将OOP与javascript结合使用还相当陌生。你在这两个方面都是对的。本地变量是私有的，尽管它们可以通过方法公开。如果你打算用上下文和形式做其他事情，那么是的，坚持你所拥有的。

var context = this;