使用 Jquery 调用每个元素时出现问题
我正在尝试创建新的 div 元素,然后使用 Jquery 更改它的位置。但是 J 查询仅影响第一个元素。我想更改具有不同编号的所有元素位置。
<div class="userList">
<?php $categories = find_category();
foreach($categories as $category): ?>
<div id="user">
<img id="<?php echo $category['cat_id']; ?>" src="<?php echo $category['cat_image']; ?>" />
<a></a>
</div>
<?php endforeach ;?>
</div>
如果我在 Jquery 中像
var a= 60;
$(".userList").children().css({'left':a+'px' ,'top':a+'px'});
a+=60;
这样将所有
更改为
但我需要使第一个左:60px 顶部:60px 和下一个左:120px 顶部:120px。我还使用了 .each 函数,例如
$(".userList").each(function(){
$("#user").css({'left':a+'px' ,'top':a+'px'});
a+=60;
});
但这次仅将第一个
更改为
而其他则不受影响。I am trying to create new div element and then change it`s position with Jquery.But J query effects only first element.I want to change all elements position with different number.
<div class="userList">
<?php $categories = find_category();
foreach($categories as $category): ?>
<div id="user">
<img id="<?php echo $category['cat_id']; ?>" src="<?php echo $category['cat_image']; ?>" />
<a></a>
</div>
<?php endforeach ;?>
</div>
If I make in Jquery like
var a= 60;
$(".userList").children().css({'left':a+'px' ,'top':a+'px'});
a+=60;
This changes all <div id="user">
to <div id="user" style="left: 60px; top: 60px; ">
But I need to make first one left:60px top:60px and next one left:120px top:120px.
I also used .each function like
$(".userList").each(function(){
$("#user").css({'left':a+'px' ,'top':a+'px'});
a+=60;
});
But this time only first <div id="user">
changed to <div id="user" style="left: 60px; top: 60px; ">
And the other does not effected.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
首先,您应该意识到页面上不能有多个具有相同 ID 的元素。您应该将
user
创建为一个类。关于这个问题,您可以使用
.each()
循环,并将60
乘以当前的index
(加一)。这将为您提供 60、然后 120、180、240 等。
First, you should be aware that you can not have more than one element on a page with the same ID. You should make
user
a class instead.With regard to the issue, you can use an
.each()
loop, and multiply60
by the currentindex
(plus one).This will give you 60, then 120, 180, 240, etc.
您设置 css 的部分正是您正在使用的代码吗?如果是这样,看起来每次迭代都会设置 a = 60。您需要在循环开始之前定义它。
The part where you set the css, is that exactly the code you're using? If so, it looks like each iteration will set a = 60. You need to define it before the start of the loop.