간단한 자바 스크립트 AJAX 게시 기능이 작동하지 않습니다.

안녕하세요, 저는 서버에 데이터를 보내고 PHP 파일을 저장하고 싶습니다. 하지만 현재는 간단한 POST로도 작업을 수행 할 수 없습니다.간단한 자바 스크립트 AJAX 게시 기능이 작동하지 않습니다.

이는 자바 및 HTML 부분이다 :이 함수는 헤드에 선언 :

<button type="button" onclick="sendTableToServer()">Save Setlist</button>

이 PHP 파일

이다

function sendTableToServer(){ 
    var xhttp; 
    if (window.XMLHttpRequest){ 
     xhttp=new XMLHttpRequest(); 
    } else { 
     xhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xhttp.open("POST","http://music.collwyncraig.info/hajimama/save_setlist.php",true); 
    xhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
    xhttp.send("fsong=AbandonSeoul"); 
}

다음이 HTML 몸에

<?php 
if (isset($_POST["fsong"])){ 
    echo 'trying'; 
    $song = $_POST["fsong"]; 
    echo $song; 
    echo 'ok'; 
} 
?>

버튼을 클릭해도 아무런 변화가 없습니다. <form>과 제출 버튼을 사용하면 브라우저가 php 파일을로드하고 입력에 액세스 할 수 있습니다. 그러나, 나는 보내고 자하는 정보가 javascript와 HTML DOM을 사용하여 HTML 페이지에서 제거 될 것이기 때문에 이와 같은 함수를 사용하고 싶습니다. 그럼 왜 아무 일도 일어나지 않습니까? : 당신이 jQuery를 아약스를 사용하지 않을 경우

출처

2012-04-07 collwyn

XHTTP에 대한 콜백은 어디에 있습니까? – neoascetic

[jQuery] (http://jquery.com) 사용을 생각한 적이 있습니까? – Fred

이 페이지에서 데이터를 얻으려면, 양식을 작성하여 제출할 것을 제외하고는 형태와 같은 동작을 원하는 경우 :

var form = document.createElement('form'); 
form.action = 'http://www.example.com/do-something'; 
form.method = 'post'; 
var song = document.createElement('input'); 
song.type = 'hidden'; 
song.name = 'song'; 
song.value = 'Song Name'; 
form.appendChild(song); 
form.submit();

출처

2012-04-07 05:05:42 icktoofay

이것은 다시 게시가 발생합니다. AJAX를 사용하는 모든 이유는 이것을 피하는 것입니다. 왜 하냐가 이걸 제안 하나? –

@Visionary : 질문에 대한 나의 해석은 전체 페이지를 양식을 통해 제출 한 것처럼 바꾸고 싶었지만 AJAX를 사용하기를 원했기 때문에 동적으로 계산 된 데이터가 필요했습니다. – icktoofay

onSubmit 이벤트에서'return false'를 사용하거나 페이지를 다시로드하지 못하도록'event.preventDefault'를 사용하십시오. 그 한 가지 빠진 세부 사항은이 솔루션의 주요 아이디어를 손상시키지 않아야합니다. +1 – jmort253

, 순수 아약스를 사용해보십시오 :

<html> 
    <head> 
    <script type="text/javascript"> 
    sendTableToServer() 
    { 

    if (window.XMLHttpRequest) 
     {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
    xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
     //document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
     } 
     } 
    xmlhttp.open("GET","http://music.collwyncraig.info/hajimama/save_setlist.php?fsong=AbandonSeoul", true); 
    xmlhttp.send(); 
    } 
    </script> 


<?php 
if (isset($_GET["fsong"])){ 
    echo 'trying'; 
    $song = $_GET["fsong"]; 
    echo $song; 
    echo 'ok'; 
} 
?>

출처 :

출처

2012-04-07 05:04:54

큰소리로 외쳐야 할 필요가 없습니다! – Gary

@Gary 그의 별명을보세요 :) – neoascetic

이것은 POST 대신 GET을 사용하는 것 외에는 가까운 것 같습니다. xmlhttp.open() 메서드에서 .php 파일의 이름을 쓰지 못했다는 점을 고쳤습니다. – collwyn

http://www.w3schools.com/php/php_ajax_php.asp은 AJAX가 자연 비동기입니다 기억하십시오. 데이터가 즉시 반환되지 않기 때문에 완료 및 오류 조건에 대한 콜백을 정의해야합니다. follow this Google tutorial on AJAX 수 있습니다. 가능한 경우 JQuery는 프로세스를 단순화합니다.

파일로 보내기 위해 서버로 데이터를 보내는 것이 목표라면 AJAX 또는 Javascript가 필요하지 않습니다. <form action="http://music.collwyncraig.info/hajimama/save_setlist.php">을 설정하고 서버로 보내려는 데이터를 양식 태그에 넣으십시오. AJAX에서 Javascript를 사용하는 유일한 이유는 찾고있는 간단한 사용보다 더 복잡한 "좋지 않은 동작"때문입니다.

출처

2012-04-07 05:05:23

당신이 외설 도메인에 POST를 만드는 경우 주소 표시 줄에있는 것과 동일하지 않으면 실패합니다.

xhttp.open("POST","/hajimama/save_setlist.php",true);

이 여기에 필요하지 않은 HTTP 및 도메인으로 현재 도메인에 POST 요청 상대를 만들 것입니다 : 계획 및 도메인을 제거

xhttp.open("POST","http://music.collwyncraig.info/hajimama/save_setlist.php",true);

보십시오 : 당신은 크로스 도메인 AJAX 요청을 할 수 없습니다 .

출처

2012-04-07 05:06:59 jmort253

아. 실제로는 도메인이 같아서 파일 이름 만 사용하면 문제가 아닌지 확인하기 위해 전체 URL을 작성했습니다. 감사. – collwyn

간단한 자바 스크립트 AJAX 게시 기능이 작동하지 않습니다.

답변

관련 문제