이벤트 핸들러에서 XHR없이 HTTP 요청을 보내십시오.

Question

eventhandler로 JavaScript를 사용하여 Post/Get 메소드로 HTTP 요청을 보내는 방법은 무엇입니까? 감사! 폴

Answer 1

좋아, 당신은 Ajax를 사용하고 싶지 않습니다. 이벤트 핸들러를 사용하여 양식을 제출할 수 있습니다!

<a href='#' onclick='cow_submit("zoodle")'>send</a>
<form method='post' id='formie' action='find_some_action.php'>
  <input type='hidden' id='snoutvar' name='snoutvar' value='snout'>
</form>

<script>
function cow_submit(a_var_to_set){
  var plip=document.getElementById('formie');
  var snout=document.getElementById('snoutvar');
  snout.value=a_var_to_set;
  plip.submit();
  }

보다 https://developer.mozilla.org/en/dom/form

Answer 2

사용 xmlhttprequest

샘플 코드 :

var client = new XMLHttpRequest();
client.onreadystatechange = handler;
client.open("GET", "test.xml");
client.send();

function handler()
{
   // your handler
}

Answer 3

당신이 사용할 수있는 xmlhttprequest JavaScript에서 요청을 보내는 것

GET 요청 보내기

var url = "get_data.php";
var params = "lorem=ipsum&name=binny";
http.open("GET", url+"?"+params, true);
http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(null);

사후 요청 보내기

var url = "get_data.php";
var params = "lorem=ipsum&name=binny";
http.open("POST", url, true);

//Send the proper header information along with the request
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.setRequestHeader("Content-length", params.length);
http.setRequestHeader("Connection", "close");

http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(params);

그리고 사용 사용 매개 변수를 인코딩하는 것을 잊지 마십시오 encodeURIComponent 사용자 입력의 경우 Param 값 인코딩의 경우

예를 들어

params="paramName="+encodeURIComponent(paramValue);

Answer 4

이를위한 표준 클래스는입니다 XmlHttpRequest, 그러나 그것은 보편적으로 지원되지 않습니다. 일부 브라우저에서 사용해야합니다 ActiveXObject("Microsoft.XMLHTTP") 대신에.

살펴보십시오 jQuery 기본 브라우저 API에 관계없이 HTTP 다운로드 (AJAX 스타일) 메소드를 제공하는 시스템 (따라서 Tzury의 답변에 표시된 많은 코드를 피 함).

jQuery ajax 문서가 있습니다 http://docs.jquery.com/ajax

Answer 5

숨겨진 필드에 Atring을 추가 한 다음 Form.submit ()를 호출하여 양식을 페이지 정의에 제출하여 작동합니다.

<script type="text/javascript">
  function doTestFormSubmit(yourString) {
    document.getElementById("myString").value=myString;
    document.getElementById("testForm").submit();
  }
</script>
<form name="testForm" id="testForm" action="yourDesiredPage.php" method="post">
   <input type="hidden" name="myString" id="myString" value=""/>
</form>

Answer 6

Ajax 튜토리얼 (http://code.google.com/edu/ajax/tutorials/ajax-tutorial.html)

var obj;

function ProcessXML(url) {
  // native  object

  if (window.XMLHttpRequest) {
    // obtain new object
    obj = new XMLHttpRequest();
    // set the callback function
    obj.onreadystatechange = processChange;
    // we will do a GET with the url; "true" for asynch
    obj.open("GET", url, true);
    // null for GET with native object
    obj.send(null);
  // IE/Windows ActiveX object
  } else if (window.ActiveXObject) {
    obj = new ActiveXObject("Microsoft.XMLHTTP");
    if (obj) {
      obj.onreadystatechange = processChange;
      obj.open("GET", url, true);
      // don't send null for ActiveX
      obj.send();
    }
  } else {
    alert("Your browser does not support AJAX");
  }
}


function processChange() {
    // 4 means the response has been returned and ready to be processed
    if (obj.readyState == 4) {
        // 200 means "OK"
        if (obj.status == 200) {
            // process whatever has been sent back here:
        // anything else means a problem
        } else {
            alert("There was a problem in the returned data:\n");
        }
    }
}