jQuery xác nhận lỗi chưa gặp: Không thể đọc thuộc 'nodeName' null

Question

Tôi có đoạn mã sau:

$(document).ready 
(
    function() 
    { 
     $.validator.addMethod(
     "lessThan", 
     function (value, element, param) 
     { 
      // bind to the blur event of the target in order to revalidate whenever the target field is updated    
      var target = $(param) 
      .unbind(".validate-lessThan") 
      .bind 
      (
       "blur.validate-lessThan", 
       function() 
       { 
        $(element).valid(); 
       } 
      ); 
      return parseFloat(value) <= parseFloat(target.val()); 
     }, 
     "Valoarea trebuie sa fie mai mica sau egala decat valoarea initiala" 
     ); 
    } 
); 


$('#gvListDetaliiElemTranAdaugare input[name$=Valoare]').each 
    (
     function (index, domEle) 
     { 
      $(this).rules 
      (
       "add" 
       , { 

        required: true, 
        minlength: 1, 
        range: [0.1, Number.MAX_VALUE], 
        lessThan: '#ListaDetaliiElemTranModelAdaugare_' + index + '__ValoareRamasa', 
        messages: 
        { 
         required: "Valoarea este necesara!", 
         minlength: "Valoarea este necesara!", 
         range: "Valoarea este necesara!", 
         lessThan: "Valoarea trebuie sa fie mai mica sau egala cu " + $('#ListaDetaliiElemTranModelAdaugare_' + index + '__ValoareRamasa').val() 


        } 
       } 
      ); 
     } 
    ); 

Mã này thất bại thì nó reeaches $ (this) .rules() với: Uncaught TypeError: Cannot read property 'nodeName' of null. html được trả lại bởi $('#gvListDetaliiElemTranAdaugare input[name$=Valoare]') là:

[ 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_0__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[0]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 18590 , 0)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_1__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[1]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 22972 , 1)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_2__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[2]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 23036 , 2)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_3__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[3]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 23038 , 3)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_4__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[4]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425306 , 4)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_5__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[5]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425308 , 5)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_6__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[6]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425309 , 6)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_7__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[7]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425310 , 7)​" type=​"text" value=​"0.00000000000">​ 
] 

Answer 1

Tôi đã tìm thấy sự cố.

Vấn đề là HTML mà tôi đang cố gắng xác thực không được chứa trong thẻ <form>...</form>.

Ngay sau khi tôi đã làm điều đó, tôi đã có một context không phải là rỗng.

Answer 2

Sự cố xảy ra vì tôi đã cố gắng ràng buộc phần tử HTML trước khi nó được tạo.

Tập lệnh của tôi được tải lên trên HTML và nó cần được tải ở cuối mã HTML của tôi.

Answer 3

Tôi gặp sự cố này và đó là do bảng điều khiển nằm ngoài phần tử [data-role = "page"].

Answer 4

Tôi gặp sự cố này trong dự án Backbone: chế độ xem của tôi chứa đầu vào và được hiển thị lại. Đây là những gì xảy ra (ví dụ cho hộp kiểm):

• Việc hiển thị đầu tiên xảy ra;
• jquery.validate được áp dụng, thêm sự kiện onClick trên đầu vào;
• Xem hiển thị lại, đầu vào gốc biến mất nhưng jquery.validate vẫn bị ràng buộc với nó.

Giải pháp là cập nhật dữ liệu nhập thay vì trả lại hoàn toàn. Dưới đây là một ý tưởng về việc thực hiện:

var MyView = Backbone.View.extend({ 
    render: function(){ 
     if(this.rendered){ 
      this.update(); 
      return; 
     } 
     this.rendered = true; 

     this.$el.html(tpl(this.model.toJSON())); 
     return this; 
    }, 
    update: function(){ 
     this.$el.find('input[type="checkbox"]').prop('checked', this.model.get('checked')); 
     return this; 
    } 
}); 

Bằng cách này bạn không cần phải thay đổi bất kỳ mã hiện gọi render(), chỉ cần đảm bảo cập nhật() giữ HTML của bạn đồng bộ và bạn tốt để đi .

Answer 5

Tôi tìm thấy câu trả lời này khi tôi nhận được lỗi tương tự cho nodeName sau khi nâng cấp lên Bootstrap 4. Vấn đề là các tab không có các lớp nav và nav-tab; thêm những thành phần <ul> đã khắc phục sự cố.