Connect_logo_6.png 退出
前端视频教程 小程序 众筹源码 python 商城源码 商城模板 响应式模板 中文模板 手机模板 企业源码
充值

jQuery自定义添加或删除标签获取ID代码

作者/代码整理:  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载) 发布日期:2018-06-17
这是一款基于layui的jQuery自定义添加或删除标签获取ID代码,可点击展开标签库和收起标签库,选择多个文字标签,已选中的标签会变成不可选状态。

上海快3开奖号码今天 www.y44gu.cn

js代码

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/layer.js"></script>
<script type="text/javascript">	
$(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 >= 8){
      layer.msg("最多可以选择8个哦");
      return false;
    }
    $(".label-selected").append(labelHTML);
    val = '';
    for(var i = 0; i < $(".label-selected").children("li").length; i++){
      val += $(".label-selected").children("li").eq(i).attr("data")+',';
    }
    $("input[name='label']").val(val);
    $(this).addClass("selected");
  });
  var val = "";
  $(".label-selected").on("click","li",function(){
    var id = $(this).attr("data");
    val = '';
    $(this).remove();
    for(var i = 0; i < $(".label-selected").children("li").length; i++){
      val += $(".label-selected").children("li").eq(i).attr("data")+',';
    }
    $("input[name='label']").val(val);
    $(".label-item").find("li[data='"+id+"']").removeClass("selected");
  });


  //点击更换标签
  var limit = 0;
  $(".replacelable").on("click",function(){
    layer.load(1);
    limit += 32;
    $.ajax({
      url:window.location.href,
      type:"post",
      datatype:"json",
      data:{
        labellimit:limit
      },
      success:function(data){
        layer.closeAll('loading');
        $(".label-item").find("li").remove();
        var html = '';
        for(var i in data){
          html += "<li data=\""+data[i].term_id+"\">x<span>"+data[i].name+"</span></li>";//拼接标签
        }
        $(".label-item").append(html);//追加至文档
      },
      error:function(){
        layer.closeAll('loading');
        layer.msg("错误~~~");
      }
    })
  })
  //获取标签
  $("#cell").on("click",function(){
  	if($("input[name='label']").val() == ""){
  		return false;
  	}else{
		layer.msg("标签内容为:"+$("input[name='label']").val());
  	}
  })
})
</script>

  • 菜鸟世界杯送出50吨包裹 荷兰成国旗最大购买地菜鸟世界杯送出50吨包裹荷兰成国旗最大购买地-手机行情 2019-05-23
  • 回复@看着就想笑,不要以你现在满脑子的资产阶级的思想去度量共产主义社会人们的思想。呵呵! 2019-05-23
  • 第五次北京市残疾人事业工作会议 暨自强与扶残助残表彰大会 2019-05-04
  • 【每日最陕西】NO.1449 西安幼升小反映问题是去年近3倍 上学难层出不穷 2019-04-12
  • 荷你有约!九江武宁澧溪镇数百亩荷花竞相绽放(组图) 2019-03-14
  • 又一国家对中国游客实行落地签 有你意想不到的五星级野奢体验 2019-03-12
  • 银保监会新规剑指大企业多头融资和过度融资 2019-03-12
  • 愿赌服输!炒股赚了没见你们给大家分点? 2019-03-10
  • 聚焦第二届世界智能大会 来天津拥抱智能时代--天津频道--人民网 2019-03-10
  • 全国政协十三届一次会议新闻中心 2019-03-01
  • 墨西哥地震与球队进球民众跳跃啥关系?专家:无关 2018-07-14
  • 视频:16小时长效持妆 测YSL墨水气垫限量版 2018-07-14
  • 城口修齐镇开展污水处理厂(站)运行管理工作检查 2018-07-13
  • 做强茶企 告别“大而不强” 2018-07-13
  • 【理上网来辉煌十九大】美国学者关注十九大报告:中国将形成新的共识继续推进改革 2018-07-12
  • 873| 56| 218| 972| 566| 261| 664| 606| 623| 652|