2013-07-31 4 views
0

Я не знаю, что я делаю неправильно, но все выглядит хорошо. Я работаю над localhost, и у меня возникли проблемы с загрузкой файла.AJAX POST запрос не работает

Это мой код. Я работаю в NetBeans, и консоль понятна без ошибок.

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function loadXMLDoc() { 
    var xmlhttp; 
    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("myDiv").innerHTML = xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("POST", "demo_post.php", true); 
    xmlhttp.send(); 
} 
</script> 
</head> 
<body> 

<h2>AJAX</h2> 
<button type="button" onclick="loadXMLDoc()">Request data</button> 
<div id="myDiv"></div> 

</body> 
</html> 

Когда я выполняю этот код, я не получаю никаких результатов.

+6

И почему вы не используете функцию .ajax JQuery? – boyd

+0

'console.log (xmlhttp)' –

+4

С меткой «jquery» и использует простой javascript. #likeaboss – MightyPork

ответ

0

между вашим .Open() и .send() вызовы, установите ваш заголовок запроса, например, s o:

xmlhttp.open("POST", "demo_post.php", true); 
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
xmlhttp.send(); 

По крайней мере, так вы сделали бы это, если бы не хотели использовать jQuery.

+0

Спасибо setRequestHeader быть проблемой. я сделаю – Jony

0

Как следует из некоторых замечаний - вам нужно посмотреть в консоли ошибок браузера. НЕ СЕТИ. Кроме того, поймите, как установить точки останова в JS и т. Д.

Ниже приведен пример того, чего вы пытаетесь достичь с помощью jQuery, который очень прост, чем использование чистого Javascript.

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script> 
<script type="text/javascript"> 

    // jQuery allows you to use selectors rather than onClick, etc 
    // So when anything with a class called "loadData" is clicked this function will run  
    $(".loadData").click(function (event) { 

     $.ajax({ 
      url: 'demo_post.php', // The URL that your making the request to 
      type: 'POST', // Type - GET or POST 
      dataType: 'html', // DataType - can be html, json or jsonp 
      cache: false, // true or false - whether you want data to be cached 
      data: 'foo=bar', // Any data that your submitting with the request. 
      error: function (error_response) { 

      // An error has occured so empty your #myDiv and put the error in there. 
      $("#myDiv").empty().append(error_response.status); 

      }, 
      success: function (response) { 

      // Everything has worked - empty #myDiv and put the replace with response 
      $("#myDiv").empty().append(response); 

      } 
     }); 

    }); 

</script> 
</head> 
<body> 
<h2>AJAX</h2> 
<button type="button" class="loadData">Request data</button> 
<div id="myDiv"></div> 

</body> 
</html> 

Вы можете найти более подробную информацию о JQuery здесь: http://api.jquery.com и более конкретно о функциях AJAX JQuery здесь - http://api.jquery.com/jQuery.ajax/

0

я обнаружил, что ваш код на самом деле предназначен для GET method.And в данном случае не важно использовать POST вместо GET. (потому что параметр не передается, а также его не форма ..), а также соглашается @Jackson

<!DOCTYPE html> 
    <html> 
    <head> 
    <!--you can use online js file but in here i download the js file from  code.jquery.com/jquery-2.0.3.min.js and kept it in localhost same folder --> 
    <script type="text/javascript" src="/jquery-2.0.3.min.js"></script> 
    <script type="text/javascript"> 
    function loadXMLDoc() 
    { 
    var xmlhttp; 
    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("myDiv").innerHTML=xmlhttp.responseText; 
    } 
} 
xmlhttp.open("GET","demo_post.php",true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 
<h2>AJAX</h2> 
<button type="button" onclick="loadXMLDoc()">Request data</button> 
<div id="myDiv"></div> 

</body> 
</html>