Question

我有这个jQuery代码。它从数据库中提取符合舒适标准的列表。但是，它打破了我页面上的所有其他搜索功能，我不确定原因。

我在第185行获得Uncaught TypeError: Cannot read property 'length' of null，这就是这一行...... if (amenityVal.length > 0) {。我在SO上寻找答案并尝试if(amenity && amenity.length > 0)，if(amenity != null && amenity.length > 0和if(amenity != null && != undefined && amenity.length > 0。

当我执行其中任何一项时，其他搜索功能都可以使用，但是舒适性搜索不再适用。不知道从哪里开始。下面是jQuery。

// amenity
function filter() {
   var rows = $("tr.matrix-listing");
   rows.hide();

   var amenityVal = $("#select-amenities").val();
   if (amenityVal.length > 0) {
      var amenity = amenityVal;
      rows = rows.filter(function(i, v) {
         var rowAmenities = $(this).data("amenities").split(/\n/);
         return $(rowAmenities).filter(function(_, element) {
           return $.inArray(element.trim(), amenity) > -1;
         }).length === amenity.length;
       });
     }

 rows.show();
}

HTML：

<div class="col-sm-2">
    <!-- Amenities -->
    <select multiple id="select-amenities" class="input-tags matrix-listing-filter" placeholder="Amenity">
      <option value=""></option>
      <option value="Central A/C">Central A/C</option>
      <option value="Doorman">Doorman</option>
      <option value="Duplex">Duplex</option>
      <option value="Elevator">Elevator</option>
      <option value="Laundry in building">Laundry in building</option>
      <option value="Dishwasher">Dishwasher</option>
      <option value="Common courtyard">Common courtyard</option>
      <option value="Private backyard">Private backyard</option>
      <option value="Shared backyard">Shared backyard</option>
      <option value="Balcony">Balcony</option>
      <option value="Terrace">Terrace</option>
      <option value="Patio">Patio</option>
      <option value="Roof access">Roof access</option>
      <option value="Private roof deck">Private roof deck</option>
      <option value="Storage space">Storage space</option>
      <option value="Bike storage">Bike storage</option>
      <option value="Gym">Gym</option>
      <option value="Private parking">Private parking</option>
      <option value="Washer dryer installed">Washer dryer installed</option>
      <option value="Washer dryer hookup">Washer dryer hookup</option>
      <option value="Wheelchair Accessible">Wheelchair Accessible</option>
    </select>
  </div>

Answer 1

不得不猜测，因为问题中没有提供HTML，但我认为在运行此脚本时DOM尚未就绪。确保将代码包装在“准备好”的回调中。这将等到DOM完全加载，并且在运行之前存在O(n)元素。

#select-amenities

Answer 2

在尝试选项时，我错过了Val，只是有了舒适性。想知道为什么它不起作用。 SMH。以下是解决方案。

// amenity
var amenityVal = $("#select-amenities").val();
if (amenityVal != null && amenityVal != undefined && amenityVal.length > 0) {
   var amenity = amenityVal;
   rows = rows.filter(function(i, v) {
      var rowAmenities = $(this).data("amenities").split(/\n/);
      return $(rowAmenities).filter(function(_, element) {
         return $.inArray(element.trim(), amenity) > -1;
      }).length === amenity.length;
   });
 }

jQuery问题，Uncaught TypeError：无法读取属性＆＃39; length＆＃39;为null

2 个答案: