从常规表单输入中获取数据以及 div 中的内容

Question

我的 wordpress 网站上有一个小型电子邮件系统，人们通过电子邮件向我提交 php 生成的内容。基本上内容是在一个 div 中生成的，然后通过一些 javascript 将 div 内容邮寄给我。我跳过了它是如何生成的部分，以便将注意力集中在主要问题上。这是一个插图。

<div id="article" style="display:none">
   // some content are generated here via php
</div>

<div id="visitor">
<input type="text" id="name" name="name" maxlength="60"/>
</div>


<input type="submit" value="submit" id="button" onClick="handleFormSubmit()">

<script language="javascript" type="text/javascript">
             function handleFormSubmit(){
             var button = document.getElementById('button');
             button.style.display = 'none';
         }
      </script>

<script type="text/javascript">
     jQuery(document).ready(function($) {
         $('#button').click(function(){
         $.ajax({
         type: 'POST',
         url: 'http://xxxxxxxxxxxxxxx/processForm.php',
         data:{'message':$('#article').html(),'client': $('#visitor').html() },
                success:function(data) {
                alert('You data has been successfully e-mailed');
                      }           
                  });
               });
           });
 </script>

请注意第一个 div-id"aricle" 块，它包含主要 内容，我一直很好现在注意第二个 div-id 第一个块正下方的“访客”块。我没能 得到那个的输入。我更愿意将其作为常规表单文本输入。

我认为我无法获得输入的原因是因为我没有任何<form></form> 标签。但是主要部分正在工作，所以我只需要它以某种方式与它一起工作。我让你们给我建议解决方案或获取这两个数据的最佳方法。我熟悉一点 php，但 javascript，一点也不熟悉。

这里是processForm.php 的内容。所有这些都是通过从网络上的几篇文章中学到的东西而组合在一起的。非常感谢。

$to = "emailto@awesomepeople.com";
  $subject  = "NEW ARTICLE";
  $message .= $_POST['message'];
  $client   = $_POST ['client'];
  $headers = "From: awesomesite <someone@website.com>" . "\r\n";
  $headers .= "MIME-Version: 1.0\r\n";
  $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";           
  mail($to, $subject, $message, $headers);

Answer 1

我只是分享下面的代码来获取提供的 div id = "visitor" 中所需文本框的值，希望它有助于获得您想要的结果：

<script type="text/javascript">
     jQuery(document).ready(function($) {<br/>

         $('#button').click(function(){<br/>

         $.ajax({<br/>
         type: 'POST',<br/>
         url: 'http://xxxxxxxxxxxxxxx/processForm.php',<br/>
         data:<br/>{<br/>'message':$('#article').html(),<br/>'client': $('#name').val() <br/>},<br/>
                success:function(data) <br/>{<br/>
                alert('You data has been successfully e-mailed');
<br/>                      }           
     <br/>             });
          <br/>     });<br/>
           });<br/>
 </script>

我已在您的脚本中将 $('#visitor').html() 替换为 $('#name').val()，解释如下： $('#visitor').html() = 给出 id = "visitor" 的 div 的内部 HTML 内容，这是一个文本框，我相信您对任何用户在该文本框中输入的值感兴趣.

$('#name').val() = 给出 id = "name" 的文本框的值

我希望以上内容能通过解释帮助您获得想要的结果。