2013-04-17 50 views
0

我目前正在使用Jquery加载函数将php内容加载到Div中。但是当我使用我的php电子邮件表单时,它会变成全白的索引页面丢失(我的意思是主布局)。无论如何,我可以使用Jquery将Insch.php加载回div,即使它需要执行?Jquery加载Php文件

<form id="contactform" method="POST" action="insch.php"> <--- this is my Form 

    $('.menut').click(function() { 
     var phpFile = $(this).attr('id') + '.php'; 
     /* alert(phpFile)*/ 
     $.get(phpFile, function (data) { 
      $('#box1').html(data); 
     }); 
     return false; 
    });     <---- my Jquery load function(on index) 

回答

0

我看到你直接将返回的数据添加到$("#box1")。如果你的php文件返回Html,你应该在ajax请求中设置dataType:'html'

+0

indexfile是php aswell(它有点像一个masterpage) 我的php只是一个mail()函数,它不返回html。尽管它回声是一个Java脚本警报。我只是需要它继续在div中加载,而它处理的邮件请求 – user2292417

0

对不起,你的问题有点难理解。我有点猜测,但这听起来像你问如何提交表单而不刷新页面。如果是这样,你可以做这样的事情:

$('.menut').click(function() { 
    var phpFile = $(this).attr('id') +'.php'; 

    $('#box1').load(phpFile, function() { // <-- this is your ready function 

     // once the form has been added to the page, 
     // add the 'submit' event listener 
     $('#contactForm').submit(function(e) { 

      // prevent the form from submitting regularly (causing a page refresh) 
      e.preventDefault(); 

      // get the data from the form 
      var data = $(this).serialize(); 

      // submit the form via AJAX and put the response in #box1 
      $('#box1').load($(this).attr('action'), data); 
     }); 
    }); 
}); 

UPDATE:

准备功能,在您的AJAX调用创建函数被执行时,内容完成加载(当内容为就绪)。它也可以称为回调功能,完成功能,或成功功能。

看看我在第四行代码中添加的注释。我已经指出了我指的是你准备好的功能。

在你的问题,可以用这个方法:

$.get(phpFile, function (data) { 
    $('#box1').html(data); 
}); 

到即相当于:

$('#box1').load(phpFile); 

这将加载响应(你的)从phpFile#box1function (data) { ... }是您的预备功能。那就是你应该将submit事件绑定到表单的地方。

如果切换到load()方法,我建议,然后你只传递一个新的功能(这将是你的准备函数)作为第二个参数load()方法,这是我给出的解决方案我原来的答案。

+0

这就是exaclty什么期望但我必须把它放在索引文件中的窗体被加载或表单页面本身? – user2292417

+0

第一次通过AJAX获取表单时,请在该AJAX调用的ready函数中执行此操作。 – Travesty3

+0

@ user2292417:查看更新的答案。我假定你在你的问题中粘贴的代码是你在何处获取表单并将其添加到页面。如果是这样,在'ready'函数中你应该绑定事件监听器。 – Travesty3