「例外TypeError：aは未定義である」jQueryプラグインを使用している場合がない要素

Question

私は、次のjQueryプラグインを持って：

$(function() { 

    $.fn.mapit = function (position, styles) { 

    var self = $(this); 

    var map = new google.maps.Map(self[0], { 
     center: position, 
     styles: styles 
    }); 

    var marker = new google.maps.Marker({ 
     position: position, 
     map: map 
    }); 

    return $(this); 

    } 
}); 

そして、私のようなものを使用してそれを呼び出す：

google.load("maps", "3", callback: function() {  

    $("div#office").mapit({ lat: 38.73972, lng: -9.144263 }, [{"featureType":"all"}]); 

}); 

問題がときであります私は次のエラーを取得する私はmapitを呼び出し、ページには何のdiv＃オフィスがありません：

TypeError: a is undefined 

私は私のプラグインに何をすべきこれを避ける？コードとして

Answer 1

は、独自のプラグインである、あなたは、あなたのプラグインの先頭に

return $(this).each(function() { 

を追加することによって、複数のセレクタ/要素を処理するためのプラグインを拡張することができます

$(function() { 
    $.fn.mapit = function (position, styles) { 

    return $(this).each(function() { 

     var self = this; 

     var map = new google.maps.Map(self, { 
     center: position, 
     styles: styles 
     }); 
     var marker = new google.maps.Marker({ 
     position: position, 
     map: map 
     }); 
    } 
    } 
}); 

詳細については、プラグインチュートリアル、具体的にはeachメソッドを使用してください：

https://learn.jquery.com/plugins/basic-plugin-creation/#using-the-each-method

div#officeが存在しない場合は、ループ内に何もないので、すべてが有効です。