Question

在其他浏览器（Opera，Chrome，IE）中无法正常排序列表（class =“ytube_date”）。仅在firefox v22.0中正常工作。告诉我如何按日期视频排序？我的代码在jsfiddle。一些值class = "ytube_date" - 空

jquery的：

function sortDescending(a, b) {
    var date1 = $(a).find(".ytube_date").text();
    date1 = date1.split('-');
    var date2 = $(b).find(".ytube_date").text();
    date2 = date2.split('-');
    return date1 < date2;
};
$(document).ready(function() {
    $('#all_elements .element').sort(sortDescending).appendTo('#all_elements');
});

HTML：

<div id="all_elements">

            <div class="element">
            <div class="ytube_form">
            <div class="ytube_form_new">
                <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-26</div>
                        <div class="ytube_time">0:16</div>
                        <a href="http://www.youtube.com/embed/7n9rcgFMqxM?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Промо 2 HD: Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Промо 2 HD" ><img src="http://img.youtube.com/vi/7n9rcgFMqxM/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                </div>
                <div class="ytube_link">Промо 2 HD</div>
            </div>
            </div>
            </div>


                <div class="element">
            <div class="ytube_form">
            <div class="ytube_form_new">
                <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-28</div>
                        <div class="ytube_time">0:49</div>
                    <a href="http://www.youtube.com/embed/cAYX3P4lZSE?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Трейлер (rus): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Трейлер (rus)" ><img src="http://img.youtube.com/vi/cAYX3P4lZSE/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                </div>
                <div class="ytube_link">Трейлер (rus)</div> 
            </div>
            </div>
            </div>

            <div class="element">
            <div class="ytube_form_red">
            <div class="ytube_form_red_new">
                <div class="ytube_pod_form_red">
                        <div class="ytube_date">2013-06-28</div>
                        <div class="ytube_time">1:59</div>
                    <a href="http://www.youtube.com/embed/zHZOoX57yS8?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Трейлер 2 (RedBand): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Трейлер 2 (RedBand)" ><img src="http://img.youtube.com/vi/zHZOoX57yS8/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                </div>
                <div class="ytube_link_red">Трейлер 2 (18+)</div>   
            </div>
            </div>
            </div>


        <div class="element">
        <div class="ytube_form">
                <div class="ytube_form_new">
                    <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-27</div>
                        <div class="ytube_time">0:16</div>
                <a href="http://www.youtube.com/embed/TFJXJy8ugBo?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Тизер 6 (2 сезон): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Тизер 6 (2 сезон)" ><img src="http://img.youtube.com/vi/TFJXJy8ugBo/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Тизер 6 (2 сезон)</div> 
                </div>
        </div>
        </div>


        <div class="element">
        <div class="ytube_form">
                <div >
                    <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-19</div>
                        <div class="ytube_time">2:04</div>
                <a href="http://www.youtube.com/embed/63TLDsnYYlU?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Фан-трейлер: Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Фан-трейлер" ><img src="http://img.youtube.com/vi/63TLDsnYYlU/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Фан-трейлер</div>   
                </div>
        </div>
        </div>


        <div class="element">
        <div class="ytube_form">
                <div class="ytube_form_new">
                    <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-27</div>
                        <div class="ytube_time"></div>
                <a href="http://www.youtube.com/embed/97WHuuKqgrQ?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=O' Death: Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть O' Death" ><img src="http://img.youtube.com/vi/97WHuuKqgrQ/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">O' Death</div>  
                </div>
        </div>
        </div>


        <div class="element">
        <div class="ytube_form">
                <div >
                    <div class="ytube_pod_form">
                        <div class="ytube_date"></div>
                        <div class="ytube_time"></div>
                <a href="http://www.youtube.com/embed/UvUHnS2uwI0?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Moira O'Hara: Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Moira O'Hara" ><img src="http://img.youtube.com/vi/UvUHnS2uwI0/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Moira O'Hara</div>  
                </div>
        </div>
        </div>



        <div class="element">
        <div class="ytube_form">
                <div class="ytube_form_new">
                    <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-23</div>
                        <div class="ytube_time"></div>
                <a href="http://www.youtube.com/embed/Tpr5bgZ6YiE?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Тизер 1 (2 сезон): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Тизер 1 (2 сезон)" ><img src="http://img.youtube.com/vi/Tpr5bgZ6YiE/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Тизер 1 (2 сезон)</div> 
                </div>
        </div>
        </div>


        <div class="element">
        <div class="ytube_form">
                <div >
                    <div class="ytube_pod_form">
                        <div class="ytube_date"></div>
                        <div class="ytube_time"></div>
                <a href="http://www.youtube.com/embed/7JDB_q83IZg?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Тизер 3 (2 сезон): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Тизер 3 (2 сезон)" ><img src="http://img.youtube.com/vi/7JDB_q83IZg/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Тизер 3 (2 сезон)</div> 
        </div>
        </div>
        </div>





        <div class="element">
        <div class="ytube_form">
                <div >
                    <div class="ytube_pod_form">
                        <div class="ytube_date"></div>
                        <div class="ytube_time"></div>
                <a href="http://www.youtube.com/embed/42w-Wye7gXc?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Тизер 5 (2 сезон): Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Тизер 5 (2 сезон)" ><img src="http://img.youtube.com/vi/42w-Wye7gXc/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Тизер 5 (2 сезон)</div> 
        </div>
        </div>
        </div>


        <div class="element">
        <div class="ytube_form">
        <div class="ytube_form_new">
                    <div class="ytube_pod_form">
                        <div class="ytube_date">2013-06-23</div>
                        <div class="ytube_time"></div>
                        <a href="http://www.youtube.com/embed/d24adem9WLM?rel=0&amp;autoplay=1" rel="shadowbox[utube];height=542;width=1000;title=Саундтрек: Американская история ужасов (American Horror Story)(2011)(3 сезона)" title="Смотреть Саундтрек" ><img src="http://img.youtube.com/vi/d24adem9WLM/1.jpg" border="0" width="126" height="95" alt="Player"/></a>
                    </div>
            <div class="ytube_link">Саундтрек</div> 
        </div>
        </div>
        </div>

</div>`

Answer 1

自定义排序中的返回值是错误的

如果第一个小于第二个，则需要返回-1;如果第一个大于第二个，则需要返回1;如果相等，则返回0，除非需要以不同方式比较它们，否则可以取出分割。

function sortDescending(a, b) {
    var date1 = $(a).find(".ytube_date").text();
    var date2 = $(b).find(".ytube_date").text();
    return (date1 < date2) ? -1 : (date1 > date2) ? 1 : 0;
};

Answer 2

更改此代码：

$('#all_elements .element').sort(sortDescending).appendTo('#all_elements');

到

$('#all_elements .element').sortDescending().appendTo('#all_elements');

在浏览器jquery排序中无法正常工作（Opera，Chrome）

2 个答案: