jQuery 使用 jQuery 删除列表项,淡出 - 从 DOM 中删除

发布于 2024-12-05 00:09:27 字数 925 浏览 1 评论 0原文

现在我正在使用 jQuery 内联脚本,我想做的是添加一个删除选项,如果删除,它将淡出并从 DOM 中删除。现在,它根本没有连接到数据库,我正在使用 VIN 解码器,所以这些是它提取的默认功能。

当然,我在下面提供的代码会删除每个列表项。我只想删除我单击“删除”的列表项。我不知道如何实现这一点,因为没有独特的课程或任何东西。

在此处输入图像描述

jQuery 代码:

// plugin defaults
$.inlineEdit.defaults = {
   hover: 'ui-state-hover',
   value: '',
   save: '',
   buttons: '<button class="save">save</button> <button class="cancel">cancel</button> <a href="#" class="delete">delete</a>',
   placeholder: 'Click to edit',
   control: 'input',
   cancelOnBlur: false,
   saveOnBlur: false
};

.find( 'a.delete' )
            .bind( 'click', function( event ) {

                $("li.editable").fadeOut(300, function() { 
                    $(this).remove(); 
                });

                return false;
            })
        .end()

Right now I am using a jQuery inline script and what I want to do is add a delete option where if deleted, it will fade out and remove from the DOM. Right now, this is not hooked up to a database at all, I am using a VIN decoder so these are the default features it pulls.

The code I provided below, of course, deletes every single list item. I want to only delete the list item that I clicked "Delete" for. I'm not sure how to accomplish this because there is no unique class or anything.

enter image description here

jQuery Code:

// plugin defaults
$.inlineEdit.defaults = {
   hover: 'ui-state-hover',
   value: '',
   save: '',
   buttons: '<button class="save">save</button> <button class="cancel">cancel</button> <a href="#" class="delete">delete</a>',
   placeholder: 'Click to edit',
   control: 'input',
   cancelOnBlur: false,
   saveOnBlur: false
};

.find( 'a.delete' )
            .bind( 'click', function( event ) {

                $("li.editable").fadeOut(300, function() { 
                    $(this).remove(); 
                });

                return false;
            })
        .end()

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

说好的呢 2024-12-12 00:09:28

只需将 $("li.editable") 替换为 $(this).closest("li.editable") 就可以了。

Just replace $("li.editable") with $(this).closest("li.editable") and you should be fine.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文