jquery 动态添加class属性
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery 动态添加class属性相关的知识，希望对你有一定的参考价值。
获取地址栏链接 如果和1.html相同 则在1.html下面的<div class="hexagon-in2">中添加active 变成
<div class="hexagon-in2 active">
ds.html以此类推 请问用jquery如何实现？
<div class="hexagon-in1">
<a href="1.html">
<div class="hexagon-in2">
<h2>首页</h2>
</div>
</a>
</div>
<div class="hexagon-in1">
<a href="ds.html">
<div class="hexagon-in2">
<h2>首页2</h2>
</div>
</a>
</div>
。。。。。
很简单。
if(location.href=='1.html')$('.hexagon-in2').addClass('.active')
追问
无效果？
参考技术A 你判断链接干什么，服务器输出的时候直接添加Active就好了三。还有，js只对当然界面有效的，如果是AJAX获取的，直接在AJAX回调函数中设置就可以了，也不用判断链接啊。jquery添加class用，$（）.addClass()追问
这是include的页面
先获取var url= window.location.href;
var index = url.substring(url.lastIndexOf('/') + 1);
然后判断href=index的链接 的 下一级div然后addClass 主要我不会啊
楼下已经回答你了。
参考技术B 有偿代做需要吗Jquery动态添加input和删除input
<body>
<form class="layui-form" >
<div class="layui-form-item">
<label for="name" class="layui-form-label" style="width:100px">游戏名称：</label>
<div class="layui-input-block">
<input type="text" name="name" class="layui-input" autocomplete="off">
</div>
</div>
<div class="layui-form-item" id="last">
<label for="address" class="layui-form-label" style="width:100px">游戏链接：</label>
<div class="layui-input-block">
<input type="text" name="address" required lay-verify="required" lay-reqtext="小子，想偷懒？" autocomplete="off" class="layui-input">
</div>
</div>
<button type="button" id="add"class="layui-btn layui-btn-warm layui-btn-sm" style="float:right" ><i class="layui-icon layui-icon-add-1" ></i><span>继续添加</span></button><br/>
<button type="button" lay-submit lay-filter="*" class="layui-btn " style="margin-left:10px" >提交</button>
<a href="javascript:;" class="layui-btn clearlink">删除旧记录</a>
</form>
</body>
<script>
//动态添加input输入框
var form = layui.form;
var max = 6;
var x = 1;
$("#add").click(function()
if(x<max)
var str = ' <div class="layui-form-item">'+
'<label for="name" class="layui-form-label" style="width:100px">游戏名称：</label>'+
'<div class="layui-input-block">'+
'<input type="text" name="name" class="layui-input" autocomplete="off">'+
'</div>'+
'</div>'+
'<div class="layui-form-item">'+
'<label for="address" class="layui-form-label" style="width:100px">游戏链接：</label>'+
'<div class="layui-input-block">'+
'<input type="text" name="address" required lay-verify="required" lay-reqtext="小子，想偷懒？" autocomplete="off" class="layui-input">'+
'</div>'+
'</div><button type="button"class="removeclass layui-btn layui-btn-danger layui-btn-sm"style="float:right">移除</button>';
$("#last").append(str);
x++;
)
//删除动态添加的input输入框
$("body").on('click',".removeclass",function()
if(x>1)
$(this).prev('div.layui-form-item').prev('div.layui-form-item').remove();
$(this).prev('div.layui-form-item').remove();
$(this).remove();
x--;
)
//清除数据
$('.clearlink').click(function()
$.get("url('clearlink')",function()
layer.msg('成功清除所有链接');
)
)
//提交表单
form.on('submit(*)', function(data)
var names = [];
var links = [];
$('.layui-form').find('input[type="text"]').each(function(index,e)
if($(this).attr('name')=="name")
names.push($(this).val());
else
links.push($(this).val());
);
var url = "url('addlink')";
var data = 'names':names,'links':links;
$.post(url,data,function(res)
if(res.status ==200)
$('.layui-form')[0].reset();
layer.msg(res.msg);
else
layer.msg('未知错误，未添加成功');
)
return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
);
</script>
以上是关于jquery 动态添加class属性的主要内容，如果未能解决你的问题，请参考以下文章