0 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="./js/jquery.blockUI.js"></script>
<script>
$(document).ready(function(){
$(".menuLink").click(function(){

$('#content').block({ 
  centerY: 0, 
  css: { top: '40px', left: '', right: '10px' },
  message: '<img src="./Images/ajax_loader.gif" /><br /><h3>Loading...Please wait.</h3>' 
});

$.ajax({
type: "POST",
url: $(this).attr('href'),
cache: false,
success: function(html){ $("#content").html(html); }
});

});

$(document).ajaxStop(function(){
$('#content').unblock();

});
});
</script>

这是我在单击时获取 div id=menu 中的链接的代码，它们将 php 文件加载到 div id=content ahref 我在这里。

<p><a class="menuLink" href="Test.php" onclick="return false;">Wall</a></p>

现在，当在 div id=menu 上单击该链接时，类和带有上面脚本的 onclick 使 Test.php 加载到 div id=content 中。

下面是 Test.php 中的脚本

session_start();
include_once("connect.php");
include_once("functions.php");

if($_POST['WallSubmit'] && $_POST['Wall']){

  $wall = makesafe($_POST['Wall']);

mysql_query("INSERT INTO `Wall` (`ID`, `Username`, `MessageBy`, `Date`, `Message`) VALUES ('', '', '$username', '" . time() . "', '$wall')");

}

<form method='post'>
  <table class="default" style="width: 80%" align="center">
<tr>
  <td class="subheader">Wall</td>
</tr>
<tr>
  <td class="content">Post a comment.<br /><textarea name='Wall' id='Wall' style='width: 99%; height: 110px;'></textarea><br /><br/><center><input type='submit' value='Post' name='WallSubmit' /></center><br /><hr><br />Latest Comments.</td>
</tr>
</td>
</table>
</form>

现在我遇到的问题是，一旦我点击了菜单上的墙，就像在 href 中看到的那样，它加载到 div id=content 完全没有问题，所以现在 Test.php 显示在内容 div 中，但是现在当我填写该表格时Test.php 它只是刷新到默认内容页面，如果它没有刷新到那里的默认内容，它不会更新数据库，然后单击时按钮不会做任何事情，现在我知道编码适用于数据库和表单在框架布局中进行了测试，并且如果我将 Test.php 设置为默认内容页面也可以工作，它将像我在页面中一样放置默认内容。

<div id="content" class="auto">
           <?include_once("Test.php");?>
         </div>

解决方案是什么？我知道这听起来有点令人困惑，但我只想弄清楚一旦我单击菜单上的 Wall 并将 Test.php 加载到 div id=content 如何在 Test.php 中获取表单来完成它的工作，哈哈。

4

1 回答 1

0

由于未指定，表单的操作只是刷新页面并提交WallSubmit到Wall主页，而不是 test.php。相反，您可以像这样指定操作：

<form action='test.php' id='wallForm' method='post'>

但是，这只会将用户带到一个包含 test.php 内容的空白页面。相反，在 javascript 中，必须进行 ajax 调用：

$(document).ready(function() {
    ...
    $(document).on("submit","#wallForm",function(){
        $.ajax({
        type: "POST",
        url: $(this).attr('action'),
        cache: false,
        data: {Wall: $("#Wall").val(), wallSubmit: $("[name=WallSubmit]").val()},
        success: function(html){ $("#content").html(html); }
        });
    });
    ...
});

on()必须调用，因为表单是在 DOM 之后加载的。否则 Javascript 将无法识别它，因为它只处理加载到 DOM 中的内容。有关这方面的更多信息，本网站包含一些有用的信息。

如果你想有一个通用的表单提交功能，serialize()应该可以做到这一点。jQuery API 页面应该很好地总结了这一点。你会data: {Wall: ...}用data: $(this).serialize(). 此函数获取表单中的有效字段并将其放入可用于将数据设置到 php 文件的字符串中。但是，我不太确定WallSubmit名称对表单的影响。据我所知，您可以完全消除该步骤。

于 2012-06-16T00:55:47.390 回答