使用jQuery发布HTML内容的问题 - Ajax Post方法

Question

我正在尝试使用jquery ajax将div部分发布到新页面：

<!DOCTYPE html>
<body>
  <div id="edit_content">
    <p>This is a test</p>    
   </div>
  <a href="out.php" id="submit_script">Submit</a>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
   $( document ).ready(function() {
          var htmlData = $('#edit_content').html();
         $.post('out.php', {'html': htmlData },function(){
      });
   });
</script>
</body>
</html>

在out.php页面中我有：

<?php
$content = $_POST['html'];
echo $content;

但是当我运行代码时，我收到此错误：

注意：未定义的索引：第2行的G：\\ Apps \\ out.php中的html

能不能让我知道为什么会这样，我怎么能阻止它？

Answer 1

您的$.post函数在数据字段中有拼写错误，请尝试以下操作：

$.post('out.php', {html: htmlData }, function(response){

由于您要发送对象，因此该密钥不需要引号。

或者更好，但是你的所有数据都在你的帖子中引用它们：

var postData = {html: $('#edit_content').html() }
$.post('out.php', postData, function(response){

Answer 2

您的代码按原样运行 - 至少就帖子而言。 为了说明这一点，将其更改为以下内容（唯一的变化是实际上对ajax请求的响应做了一些事情）：

<!DOCTYPE html>
<body>
  <div id="edit_content">
    <p>This is a test</p>    
   </div>
  <a href="out.php" id="submit_script">Submit</a>

  <div id="out"></div>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $( document ).ready(function() {
        var htmlData = $('#edit_content').html();
        $.post('out.php', {'html': htmlData }, function(data){  
            $('#out').html(data);
        });
  });
</script>
</body>
</html>

我认为你需要解释你想要做什么（或者你期望看到的）。 正如您的代码所示，您一旦页面加载（在文档就绪）但是没有对响应做任何事情，就会运行ajax请求。 然后，您有一个指向out.php的链接（ <a href="out.php" id="submit_script">Submit</a> ）。 当您点击链接时，您是否希望在out.php中看到结果？ 如果是这样，那就不会发生。 发生的事情是，当页面加载时，它会使用post数据向out.php运行请求并获得响应（然后忽略）。 当您单击该链接时，您会在没有发布数据的情况下向out.php运行新请求 ，因此您什么都看不到。

如果我猜对了，那么你想用点击链接触发的表单提交替换链接（首先获取数据）。 就像是

<!DOCTYPE html>
<body>
  <div id="edit_content">
    <p>This is a test</p>    
   </div>
  <a href="#" id="submit_script">Submit</a>

  <form action="out.php" method="post" id="out-form"  style="display: none;">
    <input type="hidden" id="hidden-html" name="html" value="" />
  </form>  

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $( document ).ready(function() {
        $('#submit_script').click(function(){
            $('#hidden-html').val($('#edit_content').html());
            $('#out-form').submit();
            return false;
        })
  });
</script>
</body>
</html>

Answer 3

'html'数据未发布到您的php页面。 将您的php文件更改为：

<?php
  if(isset($_POST['html']))
  {
    $content = $_POST['html'];
    echo $content;
  }
?>

这应该可以阻止错误并至少指向正确的方向。 如果没有更多代码，我无法告诉您为什么没有发布'html'数据。

使用jQuery发布HTML内容的问题 - Ajax Post方法

问题描述

3 个解决方案

解决方案1
1 2014-04-25 20:05:41

解决方案2
1 2014-04-25 21:43:41

解决方案3
0 2014-04-25 20:03:41

使用jQuery发布HTML内容的问题 - Ajax Post方法

问题描述

3 个解决方案

解决方案1 1 2014-04-25 20:05:41

解决方案2 1 2014-04-25 21:43:41

解决方案3 0 2014-04-25 20:03:41

解决方案1
1 2014-04-25 20:05:41

解决方案2
1 2014-04-25 21:43:41

解决方案3
0 2014-04-25 20:03:41