标签编辑选择效果

代码语言:html

所属分类:表单美化

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            $(".show-labelitem").on("click", function() {
                $(this).hide();
                $(".hide-labelitem").show();
                $("#labelItem").show();
            });
            $(".hide-labelitem").on("click", function() {
                $(this).hide();
                $(".show-labelitem").show();
                $("#labelItem").hide();
            });
            $(".label-item").on("click", "li", function() {
                var id = $(this).attr("data");
                var text = $(this).children("span").html();
                var labelHTML = "<li data='"+id+"''>x "+text+"</li>";
                if ($(this).hasClass("selected")) {
                    return false;
                } else if ($(".label-selected").children("li").length >= 5) {
                    alert("最多可以选择5个哦");
                    return false;
                }
                $(".label-selected").append(labelHTML);
                val = '';
                for (var i = 0; i < $(".label-selected").children("li").length; i++) {
                    val += $(".label-s.........完整代码请登录后点击上方下载按钮下载查看

网友评论0