[英]refresh contents of div without id
I am trying to add a refresh button to a table. 我正在尝试向表添加刷新按钮。 I currently am using. 我目前正在使用。
var $target = $(this).parent().parent().next('.box');
$target.load("$site #" +$target.prop("nodeName");
There are many .box on the page. 页面上有很多.box。 When I use the .load() is there a way I can reference the specific .box maybe by location in the DOM? 当我使用.load()时,是否可以通过DOM中的位置引用特定的.box?
Also, is there a way to delay the table loading tell the update in the database has finished? 另外,是否有一种方法可以延迟表加载以告知数据库更新已完成? I handle the update to the database before i load the content, but it still seems to load as if the database update had not happened, and a refresh is required. 在加载内容之前,我已经处理了对数据库的更新,但似乎仍未加载数据库更新,因此需要刷新。
Thank you 谢谢
You can reorganize the Html a little bit, for example wrapping the .box-content inside the .refresh div 您可以稍微重组HTML,例如将.box-content包装在.refresh div中
<section class="col col-lg-8">
<div class="box">
<div class="box-header">
<h2> <i class="fa fa-user"></i><span class="break"></span>Recently Added</h2>
<div class="box-icon"><a class="btn-minimize" href="#"><i class="fa fa-chevron-up"></i></a>
</div>
</div>
<!-- Box Header -->
<div class="box-icon"><a class="btn-reload" href="#">reload<i class="fa fa-circle"></i></a>
<div class="box-content">
<table class="table table-striped table-bordered bootstrap-datatable datatable">
<thead>
<tr>
<th>Username</th>
<th>Date registered</th>
<th>Role</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
</table>
</div>
</div>
then var $target = $(this).parent().parent().next('.box-content');
然后var $target = $(this).parent().parent().next('.box-content');
can be changed to something like: 可以更改为:
var $target = $(this).find('.box-content');
Otherwise the .parent.parent style you have now should work as long as the HTML maintains that layout for each section; 否则,只要HTML保持每个部分的布局,您现在就应该可以使用.parent.parent样式。 You are referencing it's location in the DOM using the parent.parent.next code since you know that will be the location of the proper box-content div. 您正在使用parent.parent.next代码在DOM中引用它的位置,因为您知道这将是正确的box-content div的位置。
Edit: To elaborate on why find will work with your html structure .find and the similar .children elements only look at descendant elements: from http://api.jquery.com/find/ 编辑:详细说明为什么find将与您的html结构.find和类似的.children元素一起使用,仅查看其后代元素:来自http://api.jquery.com/find/
Based on the sample Html you showed me: 根据示例HTML,您向我展示了:
<.box>
<box descendant>
<descendant element>
</box descendant>
<box descendant2>
</box descendant2>
</box>
<.box>
<box descendant>
<descendant element>
</box descendant>
<box descendant2>
</box descendant2>
</box>
Doing: 正在做:
$(.box).click(function(){
$(this).find(descendant element)
});
Will always get the correct element since .find will stay within the parent element 因为.find将保留在父元素中,所以它将始终获得正确的元素
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.