appendToを使用して、リストアイテムを一番下に移動しようとしています。'ul'および 'li'表記を使用すると機能しますが、チェックボックスをクリックしたときにのみ発生するようにします。だから私はthis.parent()を使おうとしましたが、ちょっと行き詰まっています。ここで何が悪いのかわからない..フィドル
私のHTML:
<div class='todo_list'>
<div class='add_list'>+ 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'>+</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]
コメントを追加