PHP foreach 循环和每个循环的一个 AJAX 调用 - PHP foreach loop and one AJAX call for each of the loop

PHP foreach loop and one AJAX call for each of the loop

本文关键字：循环一个 AJAX 调用 foreach PHP | 更新日期: 2023-09-27

这个问题已经在这里问过了，但我可以看到任何对我有用的答案。我在 Laravel 4 中有以下代码：

<ul class="list-group">
                    @foreach($inboxMsg as $inbox)
                       <li class="list-group-item no-border">
                            <a href="#{{ $inbox->mid }}" id="fragment1g">
                                <span class="no-margin sender center-block"><b>John Doe</b>
                                    <small class="pull-right datestamp"><strong>2:00AM</strong></small>
                                </span>
                                <span>
                                        <strong>{{ $inbox->subject }}</strong> <i class="fa fa-paperclip att"> 3</i>
                                </span>
                            </a>
                        </li>
                    @endforeach
                </ul>

如您所见，我正在使用 # 在 URL 中传递每条消息的 ID 以防止页面重新加载，在我的 AJAX 中，我试图在 #（哈希）之后获取值。这是我的 AJAX

<script type="text/javascript">
        $(document).ready(function(){
    $('.list-group-item a').click(function (event) {
  //Check if the URL has value after hash
  if(window.location.hash) {
 //set the value as a variable, and remove the #
 var hash_value = window.location.hash.replace('#', '');
 //show loader
 $('#loader').fadeIn("slow");
 //Proccess data through Ajax
 $.ajax({
                type: "POST",
                url: "{{ URL::route('post-read') }}",
                data: { mid : hash_value },
                cache: false,
                dataTye: "json",
                success: function(data)
                {
                    $('#loader').fadeOut("slow");
                    alert(data["body"]);
                }
            });;

}
});
  })
    </script>

使用此代码，它可以工作，但不正确。它迫使我在提醒邮件正文之前单击两次，当我单击第二条消息时，它首先带来第一条消息的正文，直到我再次单击它才能看到第二条消息的正文。但是如果没有这行Jquery"$('.list-group-item a').click(function (event){"，ID在#（哈希）之后的URL中传递，但AJAX调用不起作用。

还有其他方法可以做到这一点吗？

使用event.preventDefault();来防止点击链接后重新加载页面

您可以使用某些数据属性直接使用属性$inbox->mid

<a data-id="{{ $inbox->mid }}" id="fragment1g">
     <span class="no-margin sender center-block"><b>John Doe</b>
         <small class="pull-right datestamp"><strong>2:00AM</strong>
         </small>
     </span>
     <span>
             <strong>{{ $inbox->subject }}</strong> <i class="fa fa-paperclip att"> 3</i>
          </span>
</a>

<script type="text/javascript">
        $(document).ready(function(){
            $('.list-group-item a').click(function (event) {
                event.preventDefault();
                    var hash_value = $(this).attr("data-id");
                    //show loader
                    $('#loader').fadeIn("slow");
                    //Proccess data through Ajax
                    $.ajax({
                        type: "POST",
                        url: "{{ URL::route('post-read') }}",
                        data: { mid : hash_value },
                        cache: false,
                        dataTye: "json",
                        success: function(data)
                        {
                            $('#loader').fadeOut("slow");
                            alert(data["body"]);
                        }
                    });
            });
        })
    </script>

不要使用 window.location.hash。你把正确的网址放在元素中，并使用event.preventDefault（）;

.PHP：

<a href="{{ URL::route('post-read', array('mid'=>$inbox->mid)) }}">

.JS：

 event.preventDefault();
 $.ajax({
                type: "POST",
                url: $(this).attr('href'),
                cache: false,
                dataTye: "json",
                success: function(data)
                {
                    $('#loader').fadeOut("slow");
                    alert(data["body"]);
                }
            });;