1

我已经对这个细节进行了几个小时的研究，但我找不到解决方案。

我在一个房地产网站上工作，它有一个基于 JQuery 的功能，允许您按参数（价格、类型、卧室等）对列出的属性进行排序。我创建了一个启用此类功能的自定义排序功能。

在计算机上它工作得很好，但是当我在 iOS 上测试它时，它就不行了。

起初，我认为是 jQuery 不工作，但在运行一些简单的测试后，我注意到 jQuery 中的所有内容都可以正常工作，并且它解析了我需要解析的信息。不工作的部分只是排序功能。

所以我对这个原因有点困惑，我想知道是否有人有一些可能有帮助的意见。

这些是前端的 HTML 表单。

  <div id="filterControls">
  <select onclick=”” id="sortOrd">
    <option onclick=”” value="asc">ASC ↑&lt;/option>
    <option onclick=”” value="desc">DESC ↓&lt;/option>
  </select>
  <form id="filter">
    <label>Sort items by: </label>
      <input type="button" onclick=”” name="sort" value="type" class="first">   
      <input type="button" onclick=”” name="sort" value="price" class="active">
      <input type="button" onclick=”” name="sort" value="bedrooms"> 
      <input type="button" onclick=”” name="sort" value="location" class="last">        
  </form>

    <div class="clear"></div>
  </div>

这是 jQuery 部分：

var j$ = jQuery.noConflict();
j$(document).ready(function() {

//alert("I'm alive!");


// CUT THE LENGHT OF THE ADDRESS TEXT
j$('.property_title a').each(function() {
var jthis = j$(this);
jthis.text( jthis.text().slice(0,25) );
jthis.append(" ...");
});





// Custom sorting plugin


// SORT BY PRICE WHEN FIRST LOADING

// accending sort
function asc_sort(a, b){
return (j$(b).find('div[data-type='+ currentSort +']').text()) < (j$(a).find('div[data-type='+ currentSort +']').text());    
}

var currentSort = j$('#filter input[class="active"]').val();

//alert(currentSort);

j$("ul#properties li").sort(asc_sort).appendTo('ul#properties');




// USER CAN CHANGE THE SORTING BASE PARAMETER

var ua = navigator.userAgent,
event = (ua.match(/iPad/i)) ? "touchstart" : "click";

j$('#filter input[type="button"]').on("click", function(e){

// == Sorting Types 

// accending sort
function asc_sort(a, b){
return (j$(b).find('div[data-type='+ order +']').text()) < (j$(a).find('div[data-type='+ order +']').text());    
}

// decending sort
function dec_sort(a, b){
return (j$(b).find('div[data-type='+ order +']').text()) > (j$(a).find('div[data-type='+ order +']').text());      
}

// deactivate other buttons
j$('#filter input[type="button"]').removeClass("active");

//activate selected button
j$(this).addClass("active");
//e.preventDefault();

// get info from forms
var sorting = j$('#sortOrd').val();  
var order = j$(this).val();
//alert (order);

// define type of sorting to do
if (sorting == 'asc'){   
j$("ul#properties li").sort(asc_sort).appendTo('ul#properties');
}

if (sorting == 'desc'){
j$("ul#properties li").sort(dec_sort).appendTo('ul#properties');
}




});


// ASCEND OR DESCEND?

j$('#sortOrd').change(function(event){


//alert("Click event on Select has occurred!");
j$("option:selected", j$(this)).each(function(){


var newSorting = (this).value;
//alert (newSorting);   
var currentSort = j$('#filter input[class="active"]').val();
//var newSorting = j$(this).val(); 
// define type of sorting to do

if (newSorting == 'asc'){   
j$("ul#properties li").sort(asc_sort).appendTo('ul#properties');
}

if (newSorting == 'desc'){
j$("ul#properties li").sort(dec_sort).appendTo('ul#properties');
}

// == Sorting Types 

// accending sort
function asc_sort(a, b){
return (j$(b).find('div[data-type='+ currentSort +']').text()) < (j$(a).find('div[data-type='+ currentSort +']').text());    
}

// decending sort
function dec_sort(a, b){
return (j$(b).find('div[data-type='+ currentSort +']').text()) > (j$(a).find('div[data-type='+ currentSort +']').text());      
}

});


});
});

在做了几次测试之后，我最好的假设是这是无法正常工作的部分，因为在 iOS 上加载时它不会自动对它们进行排序，而且我认为其他一切似乎都工作正常：

   // == Sorting Types 

    // accending sort
    function asc_sort(a, b){
    return (j$(b).find('div[data-type='+ currentSort +']').text()) < (j$(a).find('div[data-type='+ currentSort +']').text());    
    }

    // decending sort
    function dec_sort(a, b){
    return (j$(b).find('div[data-type='+ currentSort +']').text()) > (j$(a).find('div[data-type='+ currentSort +']').text());      
    }

希望你们能帮助我。我感谢您的帮助！

4

1 回答 1

0

该错误存在于您的排序功能asc_sort()和dec_sort(). 他们正在返回true/ false-values，但他们应该返回一个数字。数字的符号表示sort()是否应该更改订单。布尔值true，false而是被解释为 1 和 0，而 0 表示相等的值。排序算法可能会或可能不会交换相等的值。

正确的排序函数类似于：

// accending sort
function asc_sort(a, b){
    return (j$(b).find('div[data-type='+ currentSort +']').text()) < (j$(a).find('div[data-type='+ currentSort +']').text() ? 1 : -1);    
}

// decending sort
function dec_sort(a, b){
    return (j$(b).find('div[data-type='+ currentSort +']').text()) > (j$(a).find('div[data-type='+ currentSort +']').text() ? 1 : -1);
}

请注意，返回值现在采用形式(condition ? 1 : -1)，因此这些函数始终返回 1 或 -1。

于 2014-06-10T07:08:38.993 回答