PHP+MySQL+jQueryUI完美便签条

kelvinlee 发布于2019-08-05 10:59 / 1367人阅读

摘要：过滤标签，并转义特殊字符内容长度为字符之间姓名长度为字符之间堆叠顺序值出错了演示下载地址

演示下载地址：http://www.erdangjiade.com/js...
效果图：

完整代码如下：

首先我们引入jQuery库、拖动插件jqueryui及弹出层插件fancybox：
      
     
    
    然后我们在notes表里面读取便签条：
    $query = mysql_query("select * from notes order by id desc limit 0, 50"); 
    while ($row = mysql_fetch_array($query)) { 
        list($left, $top, $zindex) = explode("|", $row["xyz"]); 
        $time = strtotime($row["addtime"]); 
        $notes.= " 
         
            " . $row["id"] . "." . htmlspecialchars($row["content"]) . " 
            ——" . htmlspecialchars($row["name"]) . "
(" . tranTime($time) . ")
 
        "; 
    }
    添加便签条：
    $("#addbtn").live("click", function(e) { 
            var txt = $("#note_txt").val(); 
            var user = $("#user").val(); 
            var color = $("#mycolor").val(); 
            if (txt == "") { 
                $("#msg").html("内容不能为空"); 
                $("#note_txt").focus(); 
                return false; 
            } 
            if (user == "") { 
                $("#msg").html("请输入您的姓名！"); 
                $("#user").focus(); 
                return false; 
            } 
            var left = 0; 
                    var top = 0; 
            var data = { 
                "zIndex": ++zIndex, 
                "content": txt, 
                "user": user, 
                "color": color, 
                "left":left, 
                "top":top 
            }; 
            $.post("posts.php", data, function(msg) { 
                zIndex = zIndex++; 
                //alert(zIndex); 
                if (parseInt(msg)) { 
                     
                    var str = "" + msg + "." + txt + "——" + user + "(刚刚)"; 
                    $(".container").append(str); 
                    make_draggable($(".note")); 
                    $.fancybox.close(); 
                } else { 
                    $("#msg").html(msg); 
                } 
            }); 
            e.preventDefault(); 
        });
    删除便签条：
    $(".note").find(".close").click(function() { 
            var id = $(this).parents(".note").attr("data-id"); 
            $.get("ajax.php", {id: id}, function(data) { 
                if (data == 1) { 
                    $("#note_"+id).fadeOut(); 
                } 
            }, "json") 
    })
    posts.php
    后台PHP接收ajax请求后，验证数据合法性，将数据插入数据表中，成功后返回插入的id值，返回给前台。
    $left = intval($_POST["left"]); 
    $top = intval($_POST["top"]); 
    $txt = stripslashes(trim($_POST["content"])); 
    $txt = htmlspecialchars($txt, ENT_QUOTES); 
    $txt = mysql_real_escape_string(strip_tags($txt), $link); //过滤HTML标签，并转义特殊字符 
    if (strlen($txt) < 1 || strlen($txt) > 100) { 
        echo "内容长度为1~100字符之间"; 
        exit; 
    } 
    $user = stripslashes(trim($_POST["user"])); 
    $user = htmlspecialchars($user, ENT_QUOTES); 
    $user = mysql_real_escape_string(strip_tags($user), $link); 
    if (strlen($user) < 2 || strlen($user) > 30) { 
        echo "姓名长度为2~10字符之间"; 
        exit; 
    } 
     
    $color = $_POST["color"]; 
    $time = date("Y-m-d H:i:s"); 
    $zIndex = $_POST["zIndex"];//堆叠顺序值 
    $xyz = "" . $left . "|" . $top . "|" . $zIndex; 
    $query = mysql_query("insert into notes(content,name,color,xyz,addtime)values("$txt","$user","$color","$xyz","$time")"); 
    if ($query) { 
        echo mysql_insert_id($link); 
    } else { 
        echo "出错了！"; 
    }

演示下载地址：http://www.erdangjiade.com/js...

云数据库MySQL jQueryUI 完美网络mysql主机完美空间互联mysql主机 php 进度条

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/56083.html

PHP+MySQL+jQueryUI完美便签条

摘要：过滤标签，并转义特殊字符内容长度为字符之间姓名长度为字符之间堆叠顺序值出错了演示下载地址演示下载地址：http://www.erdangjiade.com/js...效果图：showImg(https://segmentfault.com/img/bVK9tK?w=567&h=326); 完整代码如下：首先我们引入jQuery库、拖动插件jqueryui及弹出层插件fancybox...

cikenerd 2019-06-27 15:52 评论0 收藏0
PHP+MySQL+jQueryUI完美便签条

摘要：过滤标签，并转义特殊字符内容长度为字符之间姓名长度为字符之间堆叠顺序值出错了演示下载地址演示下载地址：http://www.erdangjiade.com/js...效果图：showImg(https://segmentfault.com/img/bVK9tK?w=567&h=326); 完整代码如下：首先我们引入jQuery库、拖动插件jqueryui及弹出层插件fancybox...

ShevaKuilin 2019-08-20 15:20 评论0 收藏0
PHP+MySQL+jQueryUI完美便签条

摘要：过滤标签，并转义特殊字符内容长度为字符之间姓名长度为字符之间堆叠顺序值出错了演示下载地址演示下载地址：http://www.erdangjiade.com/js...效果图：showImg(https://segmentfault.com/img/bVK9tK?w=567&h=326); 完整代码如下：首先我们引入jQuery库、拖动插件jqueryui及弹出层插件fancybox...

wenzi 2019-08-01 16:34 评论0 收藏0
实例：测试手机的短信系统

摘要：实例测试手机的短信系统详细如何去测试手机的短信系统，可以显示，查看，发送，删除短信，写出具体思路思路分为正常情况和非正常情况，以及对基础功能和非基础功能的测试，以及非黑盒测试内容外的性能测试，安全性测试，健壮性和可靠性等其他项测试。实例：测试手机的短信系统详细如何去测试手机的短信系统，可以显示，查看，发送，删除短信，写出具体思路思路分为正常情况和非正常情况，以及对基础功能和非...

Honwhy 2019-05-29 17:11 评论0 收藏0
使用SwiftyDB来管理SQLite数据库

摘要：使用来管理数据库作者，时间翻译，如有错误欢迎指出。类库使用类中的属性作为数据模型自动完成了上面的工作。这是因为我们将会使用去下载库以及一些依赖的其它项。使用将带有属性的类存储到数据库的时候意味着该类必需遵循协议该协议是中的。使用SwiftyDB来管理SQLite数据库作者：GABRIEL THEODOROPOULOS，时间：2016/3/16翻译：BigNerdCoding，如有...

ninefive 2019-06-25 15:10 评论0 收藏0