[frontend] 根据文字长度 自适应宽度 自适应高度+ Uncaught ReferenceError: xxx is not defined at HTMLDivElement.onclick
CSS一行代码就可以解决第一个问题:
1.1 根据文字长度,自适应标签宽度
解决方法:把width的设置删掉,加一行代码 display:table;
.tag-footdetail{
/*width: 300px;*/
height: 40px;
font-size: 1.5rem;
line-height: 40px;
text-align: center;
border-radius: 15px;
border: 1px solid #D2B991;
float: left;
margin-right: 30px;
margin-bottom: 10px;
background-color: #D2B991;
color: black;
display:table;
}
1.2 根据文字长度,自适应标签高度
CSS中
height:auto;
display:inline-block;
2.Uncaught ReferenceError: xxx is not defined at HTMLDivElement.onclick
解决方法:
1)注意引用juery是否有错 对应的<script>行代码请认真检查
2)这其实是个很简单的问题,主要是注意xxx是否是个字符串,要不要加引号。
以下为例,value.id和value.name 都是需要加' '的,加上之后可以解决这个问题。
function renderFootData(data) {
$.each(data.result, function(index, value) {
var html = '<div class="tag" style="font-size:28px;" onclick="getfootid(\''+value.id+'\',\''+value.name+'\');">'
+ value.name
+ '</div>';
$("#foot-data-list").append($(html));
});
}
[frontend] 根据文字长度 自适应宽度 自适应高度+ Uncaught ReferenceError: xxx is not defined at HTMLDivElement.onclick的更多相关文章
- 基于jQuery自适应宽度跟高度可自定义焦点图
基于jQuery自适应宽度跟高度可自定义焦点图.这是一款带左右箭头,缩略小图切换的jQuery相册代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <section cl ...
- 黄聪:table自适应宽度和高度
自适应宽度: td { width: 1px; white-space: nowrap; /* 自适应宽度*/ word-break: keep-all; /* 避免长单词截断,保持全部 */ } 自 ...
- UIWebView获得内容的高 高度自适应 宽度自适应
UIWebView获得内容的高-作出自适应高的UIWebView- (void)webViewDidFinishLoad:(UIWebView *)webView { NSString *height ...
- 移动端canvas文字图片合成并生成图片(canvas宽度自适应移动端屏幕)
这是我之前做的一个关于文字图片合成的代码,供大家参考,不足支出还望体谅:具体的注释在代码里都有,有什么不懂了可以留言互相交流.<!DOCTYPE html> <html lang=& ...
- 【接上一篇】winform中dataGridView高度和宽度自适应填充完数据的高度和宽度,即dataGridView根据数据自适应大小
上一篇:winform中dataGridView高度自适应填充完数据的高度 winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度 ...
- css和css3弹性盒模型实现元素宽度(高度)自适应
一.css实现左侧宽度固定右侧宽度自适应 1.定位 <!DOCTYPE html> <html lang="en"> <head> <me ...
- 纯CSS实现Div高度根据自适应宽度(百分百调整)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- CSS学习笔记(6)--浮动,三列布局,高度宽度自适应
百度ife任务三,要求中间宽度自适应,高度取三列最高者. 开始用position的relative和absolute,但是relative不能自适应宽,absolute不能加float浮动,撑不起来外 ...
- EasyUI设置Layout自适应浏览器宽度和高度
//设置自适应浏览器宽度和高度 function setLayoutHeight() { var height = $(window).height() - 20; $("#main_lay ...
随机推荐
- ArcGIS Engine 创建索引(属性索引)——提高查询效率
转自原文 ArcGIS Engine 创建索引(属性索引)——提高查询效率 众所周知,建立索引可以提高查询的效率,当对FeatureClass中的某一列频繁的查找,且数据量比较大时,建立索引是非常有必 ...
- Lightoj 1235 - Coin Change (IV) 【二分】
题目链接:http://www.lightoj.com/volume_showproblem.php?problem=1235 题意: 有N个硬币(N<=18).问是否能在每一个硬币使用不超过两 ...
- AndroidUI组件之ActionBar
有一段时间没有写博文了,发现自己的博文的完整度不是非常好.就拿AndroidUI组件这一块.一直没有更新完.我会尽快更新.好了.不多说了,今天来看一下ActionBar. 依照以往的作风.知识点都以代 ...
- UVa 1584 Circular Sequence(环形串最小字典序)
题意 给你一个环形串 输出它以某一位为起点顺时针得到串的最小字典序 直接模拟 每次后移一位比較字典序就可以 注意不能用strcpy(s+1,s)这样后移 strcpy复制地址不能有重叠部 ...
- java 工厂方法模式简单实例
工厂方法模式:也叫工厂模式,属于类创建型模式,工厂父类(接口)负责定义产品对象的公共接口,而子类工厂则负责创建具体的产品对象. 目的:是为了把产品的实例化操作延迟到子类工厂中完成,通过工厂子类来决定究 ...
- elasticsearch _field_stats 源码分析
_field_stats 实现的功能:https://www.elastic.co/guide/en/elasticsearch/reference/5.6/search-field-stats.ht ...
- B3403 [Usaco2009 Open]Cow Line 直线上的牛 deque
deque真的秀,queue和stack...没啥用了啊.操作差不多,就是在前面加一个front||back_就行了. 题干: 题目描述 题目描述 约翰的N只奶牛(编为1到N号)正在直线上排队 ...
- B1003 物流运输(最短路 + dp)
这个dp其实不是那么难,状态其实很好想,但是细节有少许偏差. 当时我并没有想到最短路要在dp之外写,后来看题解之后发现要预处理出来每段时间1~M的最短路,然后直接dp. 题目: Description ...
- codevs1519 过路费(最小生成树+LCA)
1519 过路费 时间限制: 1 s 空间限制: 256000 KB 题目等级 : 大师 Master 题目描述 Description 在某个遥远的国家里,有 n个城市.编号为 1,2 ...
- 可持久化Treap(fhq Treap,非旋转式Treap)学习(未完待续)
简介: Treap,一种表现优异的BST 优势: 其较于AVL.红黑树实现简单,浅显易懂 较于Splay常数小,通常用于树套BST表现远远优于Splay 或许有人想说S ...