2016-09-05 3 views
0

ajax quire에서 PHP 파일로 업데이트 할 HTML 요소를 가져 오려고하지만 작동하지 않습니다. 내 코드는 아래json ajax 업데이트 HTML 요소가 작동하지 않습니다.

<html> 
 
<head> 
 
<script src="jquery-3.1.0.min.js"></script> 
 
</head> 
 

 
<body> 
 

 
<script> 
 
var json = (function() { 
 
\t var json = null; 
 
    $.ajax({ 
 
     url: "test.php", 
 
     dataType: "json", //the return type data is jsonn 
 
     success: function(data){ // <--- (data) is in json format 
 
     json = data.test; 
 
\t \t $('#demo').text(json.test1); 
 
\t } 
 
    }); 
 
    return json; 
 
})(); 
 
</script> 
 
<p id="demo"></p> 
 
</body> 
 
</html>

PHP 코드

<?php 
header("Content-Type: application/json"); 

$test = array(); 
$test['test1'] = '1'; 
$test['test2'] = '2'; 
$test['test3'] = '3'; 

echo json_encode($test); 
//echo nothing after this //not even html 
?> 

사람이 도와주세요 수 , 감사합니다

답변

1

귀하의 PHP 스크립트 JSON 객체를 전송하고 액세스 할 수있는 그 같은 속성 :

$.ajax({ 
    url: "test.php", 
    dataType: "json", //the return type data is jsonn 
    success: function(data){ // <--- (data) is in json format 
    $('#demo').text(data.test1); 
} 
}); 
+0

덕분에이 나는 변수에 넣어했다 생각했다,했다. – user2669997

0

자바 스크립트가 문제입니다. AJAX 쿼리를 만드는 함수를 버튼 클릭과 같은 DOM 이벤트에 바인딩해야합니다.

PHP 측면에서
<script> 
$(document).ready(function(){ 
    $("#submit").click(function(e){ 
     e.preventDefault(); 
    $.ajax({type: "POST", 
      url: "test.php", 
      dataType: "json", 
      data: { name: $("#name").val()}, 
      success:function(data){   
       $("#demo").text(data.test1); 
      } 
    }); 
    }); 
}); 
</script> 

<input type="text" id="name" placeholder="Enter your name"> 
<button id="submit">Submit</button> 
<p id="demo"></p> 

, 당신은 입력을 읽을 수 있습니다

<?php 
header("Content-Type: application/json"); 

$test = [ 
    'test1'=>1, 'test2'=>2, 'test3'=>3, 'name'=>$_POST['name'] 
]; 
echo json_encode($test); 
exit; 
+0

나는 click 기능을 원하지 않는다. 내 목표는 ajax가 설정된 간격으로 html 요소를 업데이트하는 것이다. 나는 이것에 아주 뉴스이다 그래서 나는 이것을 일하게하고 그 위에 덧붙이려고 노력한다. – user2669997

+0

@ user2669997 이해합니다. 행운을 빕니다. – BeetleJuice

관련 문제