Question

此问题已在此处提出，但我可以看到任何有效的答案。我在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中，我试图在＃（hash）之后获取值。这是我的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＆＃34; $('.list-group-item a').click(function (event){＆＃34; ID在＃（哈希）之后在URL中传递，但AJAX调用不起作用。

还有其他办法吗？

Answer 1

点击链接后使用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>

Answer 2

不要使用window.location.hash。你应该把正确的url放在元素中并使用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"]);
                }
            });;

PHP foreach循环和每个循环的一个AJAX调用

2 个答案: