Javascript：排序以零结尾的数字不起作用（4.0 5.0 等）

Question

我使用下面的 javascript 从 div 的列表中获取当前 div 的排名，基于它的数据属性数据评级，当当前数字是 3.0、4.0 或 5.0（以零结尾）它不起作用并给出 0 而不是实际排名，我在这里做错了什么？

var count = $.inArray($("[data-rating]").filter(".current").data("rating"), $.map($("[data-rating]"), function(el, i) {
         return Number(el.attributes["data-rating"].value)
        }).sort(function(b, a) {
         return a - b
        }));

$(".rating").html(count + 1);

示例HTML：

<div class="foo" data-rating="5.0"></div>
<div class="foo" data-rating="4.8"></div>
<div class="foo current" data-rating="4.0"></div>
<div class="foo" data-rating="4.3"></div>
<div class="foo" data-rating="3.7"></div>
<div class="foo" data-rating="4.3"></div>

<div class="rating"></div>

Answer 1

将$.inArray()的第一个参数改为：

Number($("[data-rating]").filter(".current").attr("data-rating"))

jsfiddle

问题源于使用了.data()方法。您依靠该方法将 data-rating 属性值转换为 number，但它不会对 "4.0" 等值执行转换。相反，.data() returns a string 用于这些值。这意味着在这些情况下，您将 string 作为第一个参数传递给 $.inArray() 方法，这会导致它找不到数组中的值。

如果您查看 the documentation for .data()，它指出：

A value is only converted to a number if doing so doesn't change the value's representation.

因此，.data() 不会将 "4.0" 转换为 number，因为它只会转换为 4.

因为这些问题，我曾经被建议只有当值设置为.data(key, value)时才使用.data(key)获取值，如果value 是使用 HTML5 data-* 属性设置的（并执行显式类型转换）。我认为这是个好建议。

Answer 2

因此，我对您的代码进行了一些整理，使其更易于阅读。排序正常：

var sorted = $.map($("[data-rating]"), function(el, i) {
     return Number(el.attributes["data-rating"].value)
    }).sort(function(b, a) {
     return a - b
    });
// [5, 4.8, 4.3, 4.3, 4, 3.7]

然后你取 .current 元素的评分，即 returns "4.0"

var current = $("[data-rating]").filter(".current").data("rating");

并将其传递给 $.inArray():

 var count = $.inArray( current, sorted);

那 inArray returns -1 因为它在数字数组中找不到字符串“4.0”。由于某种原因 $.inArray( current, Number(sorted)) 也不起作用。

如果您在 .map 和 .inArray 中都使用 parseFloat 而不是 Number，它会起作用：

http://jsfiddle.net/gqkgetLk/2/

BTW sort 的原因是什么？如果你想用 class .current 打印元素的评分，你可以只使用

$(".rating").html( $('[data-rating].current').data('rating') );

http://jsfiddle.net/gqkgetLk/1/

Javascript：排序以零结尾的数字不起作用（4.0 5.0 等）

Javascript: sorting numbers ending with a zero not working (4.0 5.0 etc..)

javascript

sorting

jquery