- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库?
- java - OnItemClickListener 不起作用,但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
http://jsfiddle.net/phongphan117/a212my20/我有一个 json 变量并使用 jquery.each()
编写 html 标记并创建循环以在对象中添加类。如果您查看我的代码,它无法正常工作。如何修复它们?
var db = {
"class" : [
{
"appearance": ["red-bg", "white-text"]
},
{
"appearance": ["yellow-bg", "black-text"]
},
{
"appearance": "red"
},
{
"appearance": "yellow"
},
{
"appearance": ""
}
]
}
$.each(db.class, function (key, data) {
console.log(data);
$('main').append('<div class="box">text</div>');
for (i=0; i<data.appearance.length; i++) {
var classtext = data.appearance[i].toString();
$('.box').addClass(classtext);
}
});
header, main, footer { padding-left: 0px; }
.box { width: 100px; height: 100px; }
.red-bg { background-color: red; }
.yellow-bg { background-color: yellow; }
.white-text { color: white; }
.black-text { color: black; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/2.2.1/isotope.pkgd.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/css/materialize.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/js/materialize.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<main>
</main>
最佳答案
问题是,你正在传递一些array
和一些strings
,所以当你有一个数组时,元素就是里面的每个元素,即:
["red-bg", "white-text"]
[0] = "red-bg"
[1] = "white-text"
但是当是字符串的时候,每一项都是一个字母,即:
"red"
[0] = "r"
[1] = "e"
[2] = "d"
因此您只需将 class
数组更新为:
"class" : [
{
"appearance": ["red-bg", "white-text"]
},
{
"appearance": ["yellow-bg", "black-text"]
},
{
"appearance": ["red"]
},
{
"appearance": ["yellow"]
},
{
"appearance": [""]
}
]
您还必须更新每个函数,因为您要将这些类添加到同一个 .box
。
$('.box:last-child').addClass(data.appearance[i]);
现在您要将 data.appearance
添加到您最后插入的 .box
中!
它会起作用的!查看 jsfiddle https://jsfiddle.net/2z95ye56/1/
关于javascript - 来自 JSON 的 jquery.addClass 无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31737256/
如何使用 anchor 点击 addClass 和元素 addClass 一对一? 如何使用 jQuery add Class 和 removeClass 以及 JavaScript? one anc
我遇到了一个小问题。尝试更改样式/添加样式时,我不断收到以下错误: Object Gold has no method 'addClass' 这是我的 .js 文件中的代码: function Ge
有时我想在某些情况下在链中添加类。什么值在语义上最适合不添加类? 例子: $(".element").doSomething().addClass(condition ? "special-class
我有几个使用 Angular 执行动画的实例。 它们几乎相同 - 但一个有效,另一个无效 - 我无法确定第二个无效。 以下是有效的指令: - 它本质上为 element 中的一堆子元素设置动画。
我不确定 jQuery 类方法(addClass、removeClass 和toggleClass)是否充当标准 classList 方法的包装器,它们看起来与我非常相似: http://api.jq
我正在尝试编写这个脚本: 如果元素高度大于226,则addClass“portrait”,否则addClass“landscape” 我有这个: var assetHeight = $("video.
我正在尝试制作一个 slider 。我有四个内容,我把它们一个接一个地做成不可见的。然后我有一个名为 active-client 的类,它具有 display: flex 属性。我用 jQuery 的
请参阅下面的编辑。当我的验证 jquery/javascript 很差时,问题就出现了。从那以后,我实现了一个新的 css 类,它应该负责处理单个元素编辑之前所做的事情。同样,我的 jquery 验证
我正在使用这个 website 中的 JQuery eventcalendar 插件. 我的事件有开始日期和结束日期,我有以下代码在日历上添加一个绿色方 block (一个用于开始日期,一个用于结束日
我正在尝试使用 addClass 在 Joomla 模板上提供斑马条纹表格。我使用以下代码: jQuery(function($) { $("tr:odd").addClass("od
它的作用: $('p').addClass('bar'); 输出: 我需要什么: 那么是否可以将类添加到元素的第一个位置? 编辑(上下文):现在最后一个类有一个分割功能。如果添加另一个类,它也会
如何淡入淡出 .addClass。 这是链接 - http://www.bikramyogajoondalup.com.au/about-bikram-yoga/postures-benefits.h
我想创建这样的 HTML 元素 我使用javascript代码$('div').append(Array(3).fill($('test')).map((el, in
我有一组按钮,默认加载时没有我希望它们具有的类(来自第 3 方站点)。每次我单击按钮时,按钮都会发生变化 - 它们是用于滚动 的数字 (1 - 21)但它们并非全部同时显示。因此,在单击它们后,我一
我可以做 $(this).children("a").addClass("class") 并且它工作正常,但是当我做 $(this).addClass( “class”) 它不起作用。我在鼠标悬停函数
为什么 addClass 不起作用?单击带有 step 类的 div 时,div 背景和字体颜色应该发生变化,但没有任何反应。 .currentstep { bac
我有以下 html People 其中“a”的 CSS 为 color:#999999; font-size:31px; 我正在尝试使用 jQuery 来使用只有“color:#77
我有 Audi Select all 100 80 我尝试这样写: $(".select_all").click() { var models = $(this).parent().n
我有一个 style="display:none" 的 div。当鼠标悬停在链接上时,我想通过添加带有 display=block 的类来显示它,但它不起作用。 最佳答案 你需要在类中使用!impor
我使用这个CSS fa-info { background-color: green; font-size: 30px; } fa-info .active { background-co
我是一名优秀的程序员,十分优秀!