jQuery - 根据ID的值在两个现有元素之间创建新的兄弟元素

Question

我正在创建一个动态事件日历列表,我正在尝试找出一种方法,根据它们的ID在两个元素之间添加一个新元素.现有元素具有格式化为用作事件日期的ID.

ID由日期yymmdd创建

例

<li id="120523">
    This would be an event for May 23rd, 2012
</li>

<li id="120525">
    This would be for May 25th, 2012
</li>

我想要做的是动态创建一个新事件并将其放在正确的位置.例如:如果用户在2012年5月24日创建另一个事件,则应将其置于两个关于li的事件之间.

它必须是动态的,因为如果列表中有大量的事件,每天只有一个事件,它必须抓住ID大于它的第一个元素,并且第一个元素的ID小于它,并在它们之间创建新元素.

例:

我正在尝试生成这样的东西:

<li id="120504">May 4, 2012<li>

并按ID将其按正确的顺序放入一个无序列表中,如下所示:

<ul>
<li id="120123">Jan 23, 2012</li>
<li id="120415">April 15, 2012</li>
<li id="120502">May 2, 2012</li>
// new element should go here
<li id="120520">May 20, 2012</li>
<li id="120816">Aug 16, 2012</li>
</ul>

使用jQuery

Answer 1

试试这个： http: //jsfiddle.net/UJdaW/

\n\n

$(function(){\n    $(".date").datepicker();\n    $("#add").click(function(){\n        var id = parseInt( $.datepicker.formatDate(\'ymmdd\', new Date($(".date").val())));\n        var el = $("<li>This would be for " + $(".date").val() + "</li>").attr("id",id)\n        var lastLi = null;\n        $("li").each(function(){\n            var currId = parseInt($(this).attr("id"));\n            lastLi = $(this);\n            if (currId > id){\n                el.insertBefore($(this));\n                lastLi=null;\n                return false;\n            }\n        });\n\n        if (lastLi){\n            el.insertAfter(lastLi);\n        }\n    });\n});\xe2\x80\x8b\n

\n