AJAX 요청 (PHP 포함)

Question

저는 처음으로 아약스를 다루고 있습니다.이 문제를 해결하는 데는 가까운 것처럼 느껴지지만 도움이 필요합니다. 이메일 주소 입력란이있는 웹 페이지 파일이 아래에 있습니다. 사용자가 제출할 때 요청을 생성하고 요청을 처리하는 ajax doWork() 함수를 호출해야합니다. 생성 된 요청의 초기 문제가 수정되어 브라우저를 기반으로 올바른 개체가 만들어 졌다는 것이 확실합니다. 내 문제는 다시 제출되는 응답 텍스트가없고 이메일이 생성되지 않는다는 것입니다. 목표는 사용자가 전자 메일을 입력 한 다음 해당 주소로 다시 전송되는 소개 전자 메일입니다. 성공할 경우 전자 메일 목록에 성공적으로 추가되었음을 알리는 응답 문자열을 다시 보내야합니다. 일했다. 어떤 도움을 주셔서 감사합니다, 그것은 대단히 감사합니다. 그래서 여기

<?php include('../includes/educateHeader.php');?> 

<script type="text/javascript" charset="utf-8" src="ajax.js"></script> 

<div class="involve"> 
<h1>How to Get Involved In OEC</h1> 
<span>Want to become more involved in Operation:Educate Children and don't know how? Share your email address with us, like our facebook page, or check out blog out to learn more about how you can join and help children obtain the education they deserve</span><br></br> 
<form method="get"> 
    Email: <input type="email" name="email" id="email" required><br></br> 
    <input type="submit" value="Send" onclick="doWork()"> 
</form> 
</div> 

<div id="outputResponse"> 
</div> 


<?php include('../includes/educateFooter.php');?> 

는 요청을 생성하고

function getHTTPObject() { 
    if (window.ActiveXObject) { 
     return new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    else if (window.XMLHttpRequest) { 
     return new XMLHttpRequest(); 
    } 
    else { 
     alert("Your browser does not support AJAX."); 
     return null; 
    } 
} 

function setOutput() { 
    if (httpObject.readyState == 4 && httpObject.status == 200) { 
     document.getElementById('outputResponse').value = httpObject.responseText; 
    } 
} 

function doWork() { 
    httpObject = getHTTPObject(); 
    if (httpObject != null) { 
     httpObject.open("GET", "email.php?email=" + document.getElementById('email').value, true); 
     httpObject.send(null); 
     httpObject.onreadystatechange = setOutput; 
    } 
} 

var httpObject = null; 

마지막으로 여기에 email.php로 파일에서 받았다 데이터를 인쇄하고을 수용해야 email.php로 스크립트 인은 ajax.js 파일입니다 ajax를 요청하고 성공 여부를 에코 백합니다.

<?php 
if (isset($_GET['email'])) { 
    $mail = trim($_GET['email']); 
    $subject = 'Welcome!'; 
    $message = 'Thank you for joining the Operation:Educate Children email list. In the future, we will send you updates about new opportunities to become more involved in the activities that we run here at OEC and you could make a difference on children\'s futures. Thank you and best wishes!'; 
    mail($mail, $subject, $message); 
    echo 'Success! Thank you for your interest in Operaton:Educate Children. Stay tuned for updates!'; 
} 
?> 

Answer 1

먼저 함수 doWork의 말에 return false;을 추가하고 onclick="doWork()"-onclick="return doWork()"

다음 또한 선 아래 변경

document.getElementById('outputResponse').value = httpObject.responseText; 

에

document.getElementById('outputResponse').innerHTML = httpObject.responseText; 

이 질문을 너무 읽고 변경 :) Setting innerHTML vs. setting value with Javascript

Answer 2

JQuery와이 정말 쉽게 :

$.ajax({ 
    url:'email.php', 
    type: "POST", 
    data: 'email='+$('input[name=email]').val(), 
    success:function(html) { 
     $('#mydiv').html(html); 
    } 
}); 

또는 GET에 대한

, 더 쉽게 :

$.ajax({ 
    url:'email.php?email='+$('input[name=email]').val(), 
    success:function(html) { 
     $('#mydiv').html(html); 
    } 
});