appendToを使用してリストアイテムを一番下に移動します

Pepijn Gieles

appendToを使用して、リストアイテムを一番下に移動しようとしています。'ul'および 'li'表記を使用すると機能しますが、チェックボックスをクリックしたときにのみ発生するようにします。だから私はthis.parent()を使おうとしましたが、ちょっと行き詰まっています。ここで何が悪いのかわからない..フィドル

私のHTML:

<div class='todo_list'>
        <div class='add_list'>&#43; List</div><br>
        <h3 contenteditable='true'>New List</h3>
        <ul>
            <li>
                <input type='checkbox' class='task_status'>
                <p class='task' contenteditable='true'> </p>
                <span class='drag'></span>
            </li>
        </ul>
        <div class='add_task'>&#43;</div><br>
    </div>

スクリプト:

$('.todo_list').on('click', '.task_status', function(e) {
    $(this).parent('li').css('opacity', '1');
    if ( $(this).is(':checked') ) {
        $(this).parent('li').css('opacity', '.5').delay(500).slideUp(500, function () {
            $(this).parent('li').parent('ul').appendTo( $(this).parent('li') );
            $(this).slideDown(500);
        });
    };
});
アデネット

変更slideUpの値のコールバック関数内で、thisチェックボックスではなくLIになりました

$('.todo_list').on('click', '.task_status', function(e) {
    var LI = $(this).parent('li').css('opacity', '1');

    if ( $(this).is(':checked') ) {
        LI.css('opacity', '.5').delay(500).slideUp(500, function () {
            $(this).parent('ul').append( LI.slideDown(500) );
        });
    };
});

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

選択したアイテムを移動してリストの一番上に移動する方法

分類Dev

クリックするとアイテムを削除し、それらのアイテムをリストの一番下に移動します

分類Dev

AngularJSはng-focusを使用してリストアイテムをリストの一番上に移動します

分類Dev

単一のアイテムをリストの一番上に移動します

分類Dev

Redisはアイテムをリストの中央から一番上に移動します

分類Dev

jQueryを使用して、特定のクラスを持つ順序付きリストアイテムをリストの一番上に移動する方法

分類Dev

JScrollPaneで選択したアイテムをリストの一番上に移動し、残りのアイテムをJavaで表示します

分類Dev

JScrollPaneで選択したアイテムをリストの一番上に移動し、残りのアイテムをJavaで表示します

分類Dev

アイテムをクリックしたときにrecycledViewアイテムを一番下に移動する方法はありますか?

分類Dev

アイテムがリストの一番下に移動したことをユーザーに表示する

分類Dev

(Eclipse)アイテムをlistveiwの一番上に移動します

分類Dev

RecyclerViewをクリックしたアイテムを一番上に移動します

分類Dev

jQuery Sortable-ドラッグアウトした場合、アイテムをリストの一番上に移動します。

分類Dev

動的に作成されたタグをselect2のリストの一番下に移動します

分類Dev

リストアイテムをレンダリングしてから、一番下までスクロールします

分類Dev

EditTextがレイアウトの一番下に移動します

分類Dev

Pythonクラッシュコース、第2版。横向きのシューティングゲーム。エイリアンは、一番上の行が一番下に当たるまで下に移動し続けます

分類Dev

AdViewを一番下に移動します。Cocos2dxアクティビティ

分類Dev

リストアイテムを一番下に揃える方法は?

分類Dev

cssで一番上の行をテキストの一番下に移動する方法

分類Dev

テキストエディットのスクロールバーを一番上に移動します

分類Dev

List <string>に新しいアイテムを追加すると、リストの一番下に追加されるのはなぜですか?

分類Dev

MSAccess-複数選択リストボックスをクリアし、一番上の行に移動し、選択を解除します

分類Dev

ツールバーを相対レイアウトの一番上に移動します

分類Dev

Flutter-選択したアイテムがListViewの一番上に移動します

分類Dev

バニラJavascript / CSSを使用して自動的に一番下までスクロール-ポリマー

分類Dev

Djangoクエリセット-アルファベット順に並べ替えてから、特定のエントリを一番上に移動します

分類Dev

データベースからコンポーネントの状態でリストの一番上に新しいアイテムを追加します

分類Dev

XSLT 1.0:要素を親の一番下に移動して並べ替えます

Related 関連記事

  1. 1

    選択したアイテムを移動してリストの一番上に移動する方法

  2. 2

    クリックするとアイテムを削除し、それらのアイテムをリストの一番下に移動します

  3. 3

    AngularJSはng-focusを使用してリストアイテムをリストの一番上に移動します

  4. 4

    単一のアイテムをリストの一番上に移動します

  5. 5

    Redisはアイテムをリストの中央から一番上に移動します

  6. 6

    jQueryを使用して、特定のクラスを持つ順序付きリストアイテムをリストの一番上に移動する方法

  7. 7

    JScrollPaneで選択したアイテムをリストの一番上に移動し、残りのアイテムをJavaで表示します

  8. 8

    JScrollPaneで選択したアイテムをリストの一番上に移動し、残りのアイテムをJavaで表示します

  9. 9

    アイテムをクリックしたときにrecycledViewアイテムを一番下に移動する方法はありますか?

  10. 10

    アイテムがリストの一番下に移動したことをユーザーに表示する

  11. 11

    (Eclipse)アイテムをlistveiwの一番上に移動します

  12. 12

    RecyclerViewをクリックしたアイテムを一番上に移動します

  13. 13

    jQuery Sortable-ドラッグアウトした場合、アイテムをリストの一番上に移動します。

  14. 14

    動的に作成されたタグをselect2のリストの一番下に移動します

  15. 15

    リストアイテムをレンダリングしてから、一番下までスクロールします

  16. 16

    EditTextがレイアウトの一番下に移動します

  17. 17

    Pythonクラッシュコース、第2版。横向きのシューティングゲーム。エイリアンは、一番上の行が一番下に当たるまで下に移動し続けます

  18. 18

    AdViewを一番下に移動します。Cocos2dxアクティビティ

  19. 19

    リストアイテムを一番下に揃える方法は?

  20. 20

    cssで一番上の行をテキストの一番下に移動する方法

  21. 21

    テキストエディットのスクロールバーを一番上に移動します

  22. 22

    List <string>に新しいアイテムを追加すると、リストの一番下に追加されるのはなぜですか?

  23. 23

    MSAccess-複数選択リストボックスをクリアし、一番上の行に移動し、選択を解除します

  24. 24

    ツールバーを相対レイアウトの一番上に移動します

  25. 25

    Flutter-選択したアイテムがListViewの一番上に移動します

  26. 26

    バニラJavascript / CSSを使用して自動的に一番下までスクロール-ポリマー

  27. 27

    Djangoクエリセット-アルファベット順に並べ替えてから、特定のエントリを一番上に移動します

  28. 28

    データベースからコンポーネントの状態でリストの一番上に新しいアイテムを追加します

  29. 29

    XSLT 1.0:要素を親の一番下に移動して並べ替えます

ホットタグ

アーカイブ