javascript 未捕获的类型错误:无法读取未定义的属性“查找”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/48514079/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-29 08:06:11  来源:igfitidea点击:

Uncaught TypeError: Cannot read property 'find' of undefined

javascriptjqueryjconfirm

提问by basaya

Good day, I'm using jconfirmto my website project but I'm facing a weird problem that I can't solve by my own, please see my code below.

美好的一天,我在 我的网站项目中使用 jconfirm,但我面临一个我自己无法解决的奇怪问题,请参阅下面的代码。

$.confirm({
    title: 'Add Patient',
   theme: 'material',
    backgroundDismissAnimation: 'glow',
    type:'blue',
    typeAnimated: true,
    content: '' +
    '<form action="" class="formName" style ="margin: 10px;">' +
    '<div class="form-group">' +
    '<label>ID NUMBER</label>' +
    '<input type="text" class="id_number form-control" value="my id" required />' +
    '</div>' +
    '</form>',
    buttons: {
        formSubmit: {
            text: 'Submit',
            btnClass: 'btn-blue',
            action: function () {
            }
        },
        cancel: function () {
            //close
        },
    },
    onContentReady: function () {
        this.$content.find('.id_number').change(function(){
            var a = this.$content.find('.id_number').val();
             alert(a);
        });
    }
});

If you try to run that code it will return an error says.

如果您尝试运行该代码,它将返回一个错误提示。

Uncaught TypeError: Cannot read property 'find' of undefined

未捕获的类型错误:无法读取未定义的属性“查找”

But the weird thing is if I change the code like this.

但奇怪的是,如果我像这样更改代码。

onContentReady: function () {
                var a = this.$content.find('.id_number').val();
                 alert(a);
        }

The error is gone and the alert pop-up.

错误消失并弹出警报。

My problem is how can I get the value of input inside the change() method? please help or what is the correct way to make this code works?

我的问题是如何获取 change() 方法中输入的值?请帮助或使此代码正常工作的正确方法是什么?

onContentReady: function () {
            this.$content.find('.id_number').change(function(){
                var a = this.$content.find('.id_number').val();
                 alert(a);
            });

回答by Matt Goodrich

To supplement the other response, which should be marked as correct, there are three ways to define this.

为了补充其他应标记为正确的响应,可以通过三种方式定义this

  1. Function call (e.g., f()) - this refers to the global object.

  2. Method call (e.g., a.f()) - this refers to the object to the left of the dot (sometimes called the receiving object).

  3. New (constructor) call - this refers to a newly allocated object.

  1. 函数调用(例如,f())——这是指全局对象。

  2. 方法调用(例如,af())——这是指点左边的对象(有时称为接收对象)。

  3. 新(构造函数)调用 - 这是指新分配的对象。

Your .change(...)call is an example of the second in the list above. @sabithpocker's solution saves the reference to thisbefore the value of thisis changed.

您的.change(...)来电是上面列表中第二个的例子。@sabithpocker 的解决方案thisthis更改值之前保存对的引用。

回答by sabithpocker

The value of thisis different inside the change()function, to check that you can log the value.

函数this内部的值不同change(),以检查您是否可以记录该值。

As a workaround, you can keep a reference to it and use the reference.

作为一种解决方法,您可以保留对它的引用并使用该引用。

You can also use bind()to bind the value of thisto the event handler. Or check different other ways using call()or apply.

您还可以使用bind()将 的值绑定this到事件处理程序。或者使用call()或 来检查其他不同的方式apply

onContentReady: function() {
    var myReferenceToThis = this;
    this.$content.find('.id_number').change(function() {
      var a = myReferenceToThis.$content.find('.id_number').val();
      alert(a);
});

Or in your case, as @Phil suggested, simply do...

或者在您的情况下,正如@Phil 建议的那样,只需执行...

onContentReady: function() {
    var myReferenceToThis = this;
    this.$content.find('.id_number').change(function() {
      var a = $(this).val();
      alert(a);
 });