如何为这个简单的ajax提供超过1个输出?

时间:2013-02-06 08:34:33

标签: ajax

这是我从w3schools学到的用AJAX加载的脚本。

document.getElementById("sendInvoiceButton").innerHTML = '';
  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("invoiceIDStatus").innerHTML = '';
        document.getElementById("invoiceIDStatus").innerHTML=xmlhttp.responseText;
      }
    }

  var invoiceID = document.getElementById("cred_form_4684_1_wpcf-ticket-invoice-id").value;
  var text = "invoiceID=" + encodeURIComponent(invoiceID);
  document.getElementById("invoiceIDStatus").innerHTML = '<img src="http://www.lessons.com.sg/freshbooks/demo_wait.gif" />';
  xmlhttp.open("POST","/freshbooks/getInvoice.php",true);
  xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
  xmlhttp.send(text);
}

我只能输出1 xmlhttp.responseText;

我也希望将发票号码发送到文本框。我怎么能这样做?

2 个答案:

答案 0 :(得分:1)

简单的方法

if (xmlhttp.readyState==4 && xmlhttp.status==200) {
    ...
    document.getElementById("yourTextboxId").innerHTML=xmlhttp.responseText;
}

或者如果使用文本框,则表示textfield

if (xmlhttp.readyState==4 && xmlhttp.status==200) {
    ...
    document.getElementById("yourTextfieldId").value=xmlhttp.responseText;
}

我建议使用jquery,更简单和跨浏览器兼容

使用jquery,这将是

$.ajax({
    url:'/freshbooks/getInvoice.php',
    method:'POST',
    data: {invoiceID: $('#cred_form_4684_1_wpcf-ticket-invoice-id').val()},
    success: function(data) { 
       $('#invoiceIDStatus').html(data);
       $('#yourTextfieldId').val(data);
    }
});

答案 1 :(得分:0)

我不确定您收到的数据结构,但您可以将其格式化为html,然后使用find()将其拆分并放入不同的输入字段。