jQuery发布微博案例

水深无声 2023-07-09 15:27 6阅读 0赞

主要功能  
1,点击发布,动态创建 li 元素 , 获取textarea的值,添加到 li 中去.  
也动态创建了 a ,主要用来删除操作  
2,给 a 元素,绑定点击操作,点击之后把当前的 l i 删除.  
![在这里插入图片描述][20200229125717246.gif]  
代码

<div class="box">
            <textarea cols="30" rows="10"></textarea>
            <button class="btn">发布</button>
            <ul></ul>
        </div>
        <script>
            $(function() { 
                //点击动态生成 li 然后获取textarea的值添加到 li 中
                $('.btn').on('click', function() { 
                        var li = $("<li></li>");
                        li.html($('textarea').val() + '<a href ="JavaScript:;">删除</a>')
                        $('ul').prepend(li);
                        li.slideDown();
                        //添加后把textarea的值清空
                        $('textarea').val('');
                    })
                    //给删除操作注册事件
                $('ul').on('click', 'a', function() { 
                    $(this).parent('li').slideUp(function() { 
                        $(this).remove()
                    })
    
                })
    
            })
        </script>

简单实用

[20200229125717246.gif]: https://img-blog.csdnimg.cn/20200229125717246.gif

发表评论取消回复

表情：

评论列表（有 0 条评论，6人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery发布微博案例

主要功能 1,点击发布,动态创建 li 元素 , 获取textarea的值,添加到 li 中去. 也动态创建了 a ,主要用来删除操作 2,给 a 元素,绑定点击操

水深无声/ 2023年07月09日 15:27/ 0 赞/ 7 阅读

相关 php 判断是否是微博,微博发布的js判断

摘要： Document var text,number,m window.οnlοad=function ( ) \{ text=document.getElemen

小灰灰/ 2023年01月15日 03:37/ 0 赞/ 144 阅读

相关 2021 新版微博评论及其子评论爬虫发布

承诺今天发布的 2021 新版微博评论爬虫如约而至，和上一篇 [2021 新版微博话题爬虫发布 ][2021 _]一样，也是付费内容。上一篇付费内容有读者留言说，不知道

小咪咪/ 2022年10月19日 15:00/ 0 赞/ 196 阅读

相关 2021 年 7 月最新微博话题爬虫发布

写在前面时光飞逝，距离微博爬虫这个项目及系列文章 [微博超级爬虫][Link 1] 第一次发布已经过去将近两年了，最开始，我也没想到，会维护这个项目如此之久。项目更

拼搏现实的明天。/ 2022年10月19日 04:08/ 0 赞/ 176 阅读

相关微博位置爬虫发布

微博数据分析经常需要和地理位置相关联，比如查看某一话题下发博人员地理分布，或者用户爬虫下某人轨迹分布，等等；而这次的微博位置爬虫则是直接以位置为切入点爬取微博，只需要输入一个地

爱被打了一巴掌/ 2022年09月11日 13:30/ 0 赞/ 205 阅读

相关 2021 新版微博转发爬虫发布

今日发布的微博转发爬虫，是之前从没有发布过的微博爬虫，一样是付费内容，主要实现概述如下： 1. 根据指定的微博 mid 爬取该微博的转发信息。 2. 爬取该微博的转发微博

分手后的思念是犯贱/ 2022年08月30日 00:44/ 0 赞/ 175 阅读

相关新浪微博发布效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

左手的ㄟ右手/ 2022年07月14日 11:20/ 0 赞/ 366 阅读

相关用原生JavaScript代码编写类似微博发布的。

今天简单的用JS代码来创建一个类似微博发布的小项目。先把整个代码拷过来： <!DOCTYPE html> <html lang="en"> <he

太过爱你忘了你带给我的痛/ 2022年06月07日 02:12/ 0 赞/ 168 阅读

相关 Redis应用实践-使用消息队列发布微博

使用消息队列发布微博有时候我们的应用中（如：微博）会出现这样的情况，一秒钟有很多用户同时发布消息。这个时候数据库Mysql可能会出现“too many connecti

水深无声/ 2022年05月30日 03:44/ 0 赞/ 132 阅读

相关 jQuery_微博案例

微博案例：当点击表情的时候，会显示出表情包，点击表情包，会在文本域显示出对应的表情文本 HTML： <div class="box"> <p>发

我不是女神ヾ/ 2022年05月21日 00:21/ 0 赞/ 166 阅读