JSON和jQuery搜索

Question

當我使用以下代碼時，我一直在獲取以下錯誤。任何幫助表示讚賞。我一直堅持這一點。

tipuedrop.js：60遺漏的類型錯誤：無法讀取的不確定

function getTipuedrop($obj) { 
    if ($obj.val()) { 
     var c = 0; 
     for (var i = 0; i < tipuedrop_in.pages.length; i++) { 
      var pat = new RegExp($obj.val(), 'i'); 
      if ((tipuedrop_in.pages[i].name.search(pat) != -1 || tipuedrop_in.pages[i].description.search(pat) != -1) && c < set.show) { 
       if (c == 0) { 
        var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">'; 
       } 
       out += '<a href="' + tipuedrop_in.pages[i].name + '"'; 
       if (set.newWindow) { 
        out += ' target="_blank"'; 
       } 
       out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].name + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>'; 
       c++; 
      } 
     } 
     if (c != 0) { 
      out += '</div></div>'; 
      $('#tipue_drop_content').html(out); 
      $('#tipue_drop_content').fadeIn(set.speed); 
     } 
    } else { 
     $('#tipue_drop_content').fadeOut(set.speed); 
    } 
} 

財產「搜索」這裏是整個的Javascript：

(function($) { 

$.fn.tipuedrop = function(options) { 

     var set = $.extend({ 

      'show'     : 3, 
      'speed'     : 300, 
      'newWindow'    : false, 
      'mode'     : 'static', 
      'contentLocation'  : 'tipuedrop/tipuedrop_content.json' 

     }, options); 

     return this.each(function() { 

      var tipuedrop_in = { 
       pages: [] 
      }; 
      $.ajaxSetup({ 
       async: false 
      }); 

      if (set.mode == 'json') 
      { 
       $.getJSON(set.contentLocation) 
        .done(function(json) 
        { 
          tipuedrop_in = $.extend({}, json); 
        }); 
      }    

      if (set.mode == 'static') 
      { 
       tipuedrop_in = $.extend({}, tipuedrop); 
      } 

      $(this).keyup(function(event) 
      { 
       getTipuedrop($(this)); 
      });    

      function getTipuedrop($obj) 
      { 
       if ($obj.val()) 
       { 
        var c = 0; 
        for (var i = 0; i < tipuedrop_in.pages.length; i++) 
        { 
          var pat = new RegExp($obj.val(), 'i'); 
          if ((tipuedrop_in.pages[i].name.search(pat) != -1 || tipuedrop_in.pages[i].description.search(pat) != -1) && c < set.show) 
          { 
           if (c == 0) 
           { 
            var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">';  
           } 
           out += '<a href="' + tipuedrop_in.pages[i].name + '"'; 
           if (set.newWindow) 
           { 
            out += ' target="_blank"'; 
           } 
           out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].master_image + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>'; 
           c++; 

           console.log(tipuedrop_in.pages[i].name); 
           console.log(tipuedrop_in.pages[i].description); 
          } 
        } 
        if (c != 0) 
        { 
          out += '</div></div>';    
          $('#tipue_drop_content').html(out); 
          $('#tipue_drop_content').fadeIn(set.speed); 
        } 
       } 
       else 
       { 
        $('#tipue_drop_content').fadeOut(set.speed); 
       } 
      } 

      $('html').click(function() 
      { 
       $('#tipue_drop_content').fadeOut(set.speed); 
      }); 

     }); 
}; 

})(jQuery);   

Answer 1

你的JSON數組有一個沒有的元素和description屬性。它是在指數322號"dae04696-2acb-4972-a471-1b873e2a8d4f"元素：

if ((tipuedrop_in.pages[i].name.search(pat) != -1 || .... 

：

{ 
    "fees":[],"variations":[], 
    "available_for_pickup":true, 
    "available_online":false, 
    "visibility":"PUBLIC", 
    "id":"dae04696-2acb-4972-a471-1b873e2a8d4f", 
    "type":"NORMAL" 
} 

，是因爲你試圖在不確定的name屬性使用字符串方法（搜索），您的代碼將提高在下面的語句錯誤

因此，在if前加一個附加條件以確保該屬性存在，並且與description一樣。

if ((tipuedrop_in.pages[i].name 
      && tipuedrop_in.pages[i].name.search(pat) != -1 
     || tipuedrop_in.pages[i].description 
      && tipuedrop_in.pages[i].description.search(pat) != -1) 
    && c < set.show) { 
     ... 

注意，轉換爲字符串明確（與String(tipuedrop_in.pages[i].name)）也將刪除的錯誤，因爲它會呈現「未定義」（串）當name屬性不存在。

但是，這有一個副作用：

當你通過的「不確定」的子字符串進行搜索，比如「精」，你會得到這個不確定的名字，這可能不是什麼比賽你想作爲行爲。

Answer 2

創建名稱和說明一些變量然後應用搜索他們

function getTipuedrop($obj) { 
    if ($obj.val()) { 
     var c = 0; 
     for (var i = 0; i < tipuedrop_in.pages.length; i++) { 
      var pat = new RegExp($obj.val(), 'i'); 
      var nm = String(tipuedrop_in.pages[i].name); 
      var desc = String(tipuedrop_in.pages[i].description); 
      if ((nm.search(pat) != -1 || desc.search(pat) != -1) && c < set.show) { 
       if (c == 0) { 
        var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">'; 
       } 
       out += '<a href="' + tipuedrop_in.pages[i].name + '"'; 
       if (set.newWindow) { 
        out += ' target="_blank"'; 
       } 
       out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].name + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>'; 
       c++; 
      } 
     } 
     if (c != 0) { 
      out += '</div></div>'; 
      $('#tipue_drop_content').html(out); 
      $('#tipue_drop_content').fadeIn(set.speed); 
     } 
    } else { 
     $('#tipue_drop_content').fadeOut(set.speed); 
    } 
}