使用来自HTML表单的多个输入作为AJAX调用的URL中的变量,可以通过以下步骤实现:
下面是一个示例代码:
HTML部分:
<form id="myForm">
<input type="text" id="input1" name="input1">
<input type="text" id="input2" name="input2">
<button type="button" onclick="sendAjaxRequest()">Submit</button>
</form>
JavaScript部分:
function sendAjaxRequest() {
// 获取输入值
var input1Value = document.getElementById("input1").value;
var input2Value = document.getElementById("input2").value;
// 构建URL
var url = "https://example.com/api?input1=" + input1Value + "&input2=" + input2Value;
// 创建AJAX请求对象
var xhr = new XMLHttpRequest();
// 发送AJAX请求
xhr.open("GET", url, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 处理响应
var response = xhr.responseText;
// ...
}
};
xhr.send();
}
在实际应用中,可以根据具体需求选择合适的AJAX库或框架,例如jQuery、axios等,以简化AJAX请求的处理过程。
请注意,以上示例中的URL仅作为示意,实际应用中需要根据具体情况进行修改。
领取专属 10元无门槛券
手把手带您无忧上云