我有一個(gè)搜索框可以從 API 請(qǐng)求信息。但是當(dāng)我使用搜索框時(shí)，我會(huì)被定向到一個(gè)包含結(jié)果的新 HTML 頁(yè)面。我想在搜索框正下方的同一頁(yè)面上顯示結(jié)果。這就是我到目前為止所擁有的。<form method="get" id="Search" action="https://api.hackertarget.com/aslookup/?q=" ONSUBMIT="submit(); return false;"> <input type="hidden" name="sites" value="" /> <input type="hidden" name="k7" value="#ffffff" /> <input type="hidden" name="k8" value="#222222" /> <input type="hidden" name="k9" value="#00278e" /> <input type="hidden" name="kx" value="#20692b" /> <input type="hidden" name="kj" value="#fafafa" /> <input type="hidden" name="kt" value="p" /> <input type="text" name="q" placeholder="INFO" aria-label="Search" /> <button type="submit">Search</button></form>
1 回答
一只斗牛犬
TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超2個(gè)贊
您需要使用AJAX調(diào)用。我jQuery.ajax在此示例代碼中使用了方法。您還可以使用瀏覽器的fetchAPI 或XMLHttpRequestAPI。
$(function() {
? $('#Search').on('submit', function() {
? ? event.preventDefault();
? ? var url = 'https://api.hackertarget.com/aslookup/';
? ? var data = $('#Search').serialize();
? ? $.ajax(url + '?' + data).then(function(data) {
? ? ? $('.output').text(data);
? ? });
? });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="get" id="Search">
? <input type="hidden" name="sites" value="" />
? <input type="hidden" name="k7" value="#ffffff" />
? <input type="hidden" name="k8" value="#222222" />
? <input type="hidden" name="k9" value="#00278e" />
? <input type="hidden" name="kx" value="#20692b" />
? <input type="hidden" name="kj" value="#fafafa" />
? <input type="hidden" name="kt" value="p" />
? <input type="text" name="q" placeholder="INFO" aria-label="Search" />
? <button type="submit">Search</button>
</form>
<pre class="output"></pre>
蝴蝶不菲
TA貢獻(xiàn)1810條經(jīng)驗(yàn) 獲得超4個(gè)贊
<form onsubmit="onsubmitForm(event)">
<input type="hidden" name="sites" value="" />
<input type="hidden" name="k7" value="#ffffff" />
<input type="hidden" name="k8" value="#222222" />
<input type="hidden" name="k9" value="#00278e" />
<input type="hidden" name="kx" value="#20692b" />
<input type="hidden" name="kj" value="#fafafa" />
<input type="hidden" name="kt" value="p" />
<input type="text" name="q" placeholder="INFO" aria-label="Search" />
<button type="submit">Search</button>
</form>
<script src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<script>
function onsubmitForm(e) {
e.preventDefault();
var url = "https://api.hackertarget.com/aslookup?q="+$("input[name='q']").val();
$.ajax({
url: url,
method: "GET",
success: function (result) {
console.log(result);
}
});
}
</script>
- 1 回答
- 0 關(guān)注
- 141 瀏覽
添加回答
舉報(bào)
0/150
提交
取消