Question

我是javascript初学者，所以我需要一些帮助:) 我在互联网上找到一些关于ajax在bootstrap模式下加载php文件的教程，但仍然有一些问题..

以下是代码：

的public_html /资产/ JS / m.js

 $(document).ready(function(){ 

    // modals
    $(document).on('click', '#getUser', function(e){

        e.preventDefault();

        var uid = $(this).data('id');   // it will get id of clicked row

        $('#dynamic-content').html(''); // leave it blank before ajax call
        $('#modal-loader').show();      // load ajax loader

        $.ajax({
            url: 'ajax.php',
            type: 'POST',
            data: 'id='+uid,
            dataType: 'html'
        })
        .done(function(data){
            console.log(data);  
            $('#dynamic-content').html('');    
            $('#dynamic-content').html(data); // load response 
            $('#modal-loader').hide();        // hide ajax loader   
        })
        .fail(function(){
            $('#dynamic-content').html('<i class="glyphicon glyphicon-info-sign"></i> Something went wrong, Please try again...');
            $('#modal-loader').hide();
        });

    });
});

公开/资产/包含/ pagefile.php

调用模态：

<button data-toggle="modal" data-target="#view-modal" data-id="$cat[id]" id="getUser" class="btn btn-success">Open</button>

<div id="view-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
     <div class="modal-dialog"> 
          <div class="modal-content"> 

               <div class="modal-header"> 
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
                    <h4 class="modal-title">
                        <i class="glyphicon glyphicon-user"></i> User Profile
                    </h4> 
               </div> 
               <div class="modal-body"> 

                   <div id="modal-loader" style="display: none; text-align: center;">
                    <img src="ajax-loader.gif">
                   </div>

                   <!-- content will be load here -->                          
                   <div id="dynamic-content"></div>

                </div> 
                <div class="modal-footer"> 
                      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
                </div> 

         </div> 
      </div>

的public_html / ajax.php

<?php
include("connect_db.php");

  if (isset($_REQUEST['id'])) {
     $id = $_REQUEST['id'];

     echo "$id";
  } else {} 
?>

一切看起来都不错，但我无法加载ajax内容，模态始终显示出了点问题，请再试一次......

我想询问是否要在ajax.php文件中添加更多路径/任务如何在javascript中添加以及如何发布/获取更多var？

非常感谢，抱歉我的英语不好：D

Answer 1

您正在使用ajax请求ajax.php的相对网址，这意味着从与当前网页（public/assets/include/pagefile.php）相同的路径加载此网页。
由于ajax.php和pagefile.php不在同一条道路上，因此您会收到错误要正确加载ajax.php，您可以从网络服务器的根目录/ajax.php或相对于当前页面../../../ajax.php

进行调用

    $.ajax({
        url: '/ajax.php', // or url: '../../../ajax.php',
        type: 'POST',
        data: 'id='+uid,
        dataType: 'html'
    })

javascript初学者，加载php文件

1 个答案: