个人中心
gpt4 book ai didi

javascript - 当 div 位于同一页面时，如何使用 Ajax 每 10 秒更新一次 div

转载 作者：行者123 更新时间：2023-11-28 06:49:45 25 4
gpt4 key购买 nike

我正在使用 Laravels 框架来开发社交网络。我只是想知道如何每 10 秒更新一次我的 div 等(状态 div)

在我的 home.blade.php 页面上，我使用了默认模板的扩展函数，如下所示:

<body>
@include('templates.partials.navigation')
<div class="container">
    @include('templates.partials.alerts')
    @yield('content')
</div>


如您所见，我在时间轴.blade.php 中包含内容，如下所示:

    @extends('templates.default')

@section('content')
    <div class="row">
        <div class="col-lg-7">
            @if (!$statuses->count())
                <p>There's nothing in your timeline.</p>
            @else
                @foreach ($statuses as $status)
                <div class="ui stacked segment status-modal" style="width:665px">
                    <div class="media">
                        <a class="pull-left" href="{{ route('profile.index', ['username = $status->user->username']) }}">
                            <img class="media-object" alt="{{ $status->user->getNameOrUsername() }}" src="{{ $status->user->getAvatarUrl() }}">
                        </a>
                        <div class="media-body">
                            <h4 class="media-heading"><a href="{{ route('profile.index', ['username = $status->user->username']) }}">{{ $status->user->getNameOrUsername() }}</a></h4>
                            <p>{!! $status->body !!}</p>
                            <ul class="list-inline">
                                <span style="margin-left:5px" data-livestamp="{{ $status->created_at }}"></span>
                                @if($status->user->id !== Auth::user()->id)
                                    <li><a href="{{ route('status.like', ['statusId' => $status->id]) }}">Like</a></li>
                                @endif
                                <li>{{ $status->likes->count() }} likes</li>
                            </ul>
                            @foreach ($status->replies as $reply)
                                <div class="media">
                                    <a class="pull-left" href="#">
                                        <img class="media-object" alt="{{ $reply->user->getNameOrUsername() }}" src="{{ $reply->user->getAvatarUrl() }}">
                                    </a>
                                    <div class="media-body">
                                        <h5 class="media-heading"><a href="#">{{ $reply->user->getNameOrUsername() }}</a></h5>
                                        <p>{{ $reply->body }}</p>
                                        <ul class="list-inline">
                                            <li>{{ $reply->created_at->diffForHumans() }}</li>
                                            @if(Auth::user()->hasLikedStatus($reply))
                                                    <li><a href="{{ route('status.unlike', ['statusId' => $reply->id]) }}">Unlike</a></li>
                                            @elseif($reply->user->id !== Auth::user()->id)
                                                <li><a href="{{ route('status.like', ['statusId' => $reply->id]) }}">Like</a></li>
                                            @endif
                                            <li>{{ $reply->likes->count() }} likes</li>
                                        </ul>
                                    </div>
                                </div>
                            @endforeach

                            <form role="form" action="{{ route('status.reply', ['statusId' => $status->id]) }}" method="post">
                                <div class="ui form form-group{{ $errors->has("reply-{$status->id}") ? ' has-error': '' }} ">
                                    <textarea name="reply-{{ $status->id }}" class="form-control" rows="2" placeholder="Reply to this status" style="resize:none"></textarea>
                                    @if($errors->has("reply-{$status->id}"))
                                        <span class="help-block">{{ $errors->first("reply-{$status->id}") }}</span>
                                    @endif
                                </div>
                                <input type="submit" value="Reply" class="button-reply btn btn-default btn-sm ui green basic button">
                                <input type="hidden" name="_token" value="{{ Session::token() }}">
                            </form>
                        </div>
                    </div>
                </div>
                @endforeach
                {!! $statuses->render() !!}
            @endif
        </div>
</div>
@stop

那么我如何刷新 div 而不像 load() ajax 方法那样实际重新加载整个页面？

最佳答案

你无法单独在 Laravel 中做到这一点。如上所述，您必须将 javascript 与 setInterval 一起使用。 http://www.w3schools.com/jsref/met_win_setinterval.asp

使用 jQuery，它看起来像这样

setInterval(function(){
$.ajax({
    url:'some url here to get the contents of your div'
}).done(function(response){
    $(".container").html(response);
});}, 10000);

我还没有测试过这个，所以不要引用我的观点。

关于javascript - 当 div 位于同一页面时，如何使用 Ajax 每 10 秒更新一次 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33070066/

25 4 0
文章推荐： css - 基金会SASS
文章推荐： javascript - 执行了 ajax 请求。如何格式化返回的数据？
文章推荐： javascript - 主干点击事件: Trigger only on element actually clicked on
文章推荐： javascript - jQuery DataTable 分页刷新
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com