إرسال طلب HTTP دون XHR في معالج الحدث

Question

وكيفية إرسال طلب HTTP مع أي آخر / الحصول على طريقة استخدام جافا سكريبت باعتبارها eventhandler؟ شكر! بول

Answer 1

حسنا، كنت لا تريد استخدام اياكس. يمكنك استخدام معالج الحدث لتقديم نموذج!

<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

مدعوم

ونموذج التعليمات البرمجية:

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

function handler()
{
   // your handler
}

Answer 3

ويمكنك استخدام مدعوم لإرسال طلب من جافا سكريبت

وإرسال طلب 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);

وإرسال طلب POST

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 لترميز قيمة المعلمة في حالة إدخال المستخدم

ومنها مثلا.

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

Answer 4

والطبقة القياسية للقيام بذلك هي XmlHttpRequest، ولكن ليست مدعومة من الجميع. على بعض المتصفحات لديك لاستخدام ActiveXObject("Microsoft.XMLHTTP") بدلا من ذلك.

وانظروا إلى مسج النظام الذي يوفر HTTP تحميل (AJAX نمط) أساليب بغض النظر عن واجهات برمجة التطبيقات متصفح الأساسية (وبالتالي تجنب الكثير من الرمز المبين في الإجابة Tzury ل).

وثائق مسج AJAX هي في http://docs.jquery.com/Ajax

Answer 5

ويجب عليك محاولة لإضافة سلسلة في حقل مخفي ومن ثم استدعاء 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

واياكس دروس ( http://code.google.com/ ايدو / اياكس / دروس / اياكس-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");
        }
    }
}