5

動的なイベントカレンダーリストを作成しており、IDに基づいて2つの要素の間に新しい要素を追加する方法を見つけようとしています。既存の要素には、イベントの日付として使用するようにフォーマットされた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の2つの間に配置する必要があります。

リストに多数のイベントがあり、1日に1つのイベントしかない場合、IDがそれよりも大きい最初の要素を取得する必要があり、IDがそれよりも小さい最初の要素を取得する必要があるため、動的である必要があります。それらの間に新しい要素を作成します。

例：

私はこのようなものを生成しようとしています：

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

次のように、idで正しい順序でunordered-listに配置します。

<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を使用する

4

2 に答える 2

1

これを試してください：http：//jsfiddle.net/UJdaW/

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

        if (lastLi){
            el.insertAfter(lastLi);
        }
    });
});​
于 2012-09-12T05:23:25.557 に答える
0

あなたの質問についてはよくわかりませんが、IDに基づいて2つの要素の間に新しい要素を追加したいのですが... jQuery wrapを試してみましたか？http：//api.jquery.com/包む/

お役に立てれば...

于 2012-09-12T05:15:54.007 に答える