我已经通过索引页面设置了 Bootstraps 导航选项卡。每个选项卡通过 AJAX 加载一个单独的 PHP 文件:
<div class="container">
<ul class="nav nav-tabs" id="indextabs">
<li><a href="notes.php" data-target="#notes" data-toggle="tabchange">NOTES</a></li>
<li><a href="whois.php" data-target="#whois" data-toggle="tabchange">WHOIS</a></li>
<li><a href="dig.php" data-target="#dig" data-toggle="tabchange">DIG</a></li>
<li><a href="ets.php" data-target="#ets" data-toggle="tabchange">ETS</a></li>
<li><a href="resources.php" data-target="#resources" data-toggle="tabchange">RESOURCES</a></li>
</ul>
</div>
处理 AJAX 查询的 JavaScript:
window.onload = function() {
$('[data-toggle="tabchange"]').click(function(e) {
var $this = $(this),
loadurl = $this.attr('href'),
targ = $this.attr('data-target');
$.get(loadurl, function(data) {
$(targ).html(data);
});
$this.tab('show');
return false;
});
}
这本身工作正常。然而,在某些选项卡中,有一个输入需要一个域名,然后需要通过 GET 请求提交该 URL,以便 URL 可以是这样的:
http://domain.com/?domain=google.com&record=mx
考虑到这一点,我有两个问题:
- 如何使用 GET 方法 URL 加载特定选项卡?
- 如何使用 GET 方法通过 AJAX 提交表单数据并让它更改 URL 并将内容加载到选项卡面板 div 中?
最佳答案
请将以下内容更像是评论,因为我不确定在您的情况下什么是最佳的(并且也有效)。无论如何,我认为您需要在 $get method call 中传递查询参数,可以是对象、键值对 { domain: 'google.com', record: 'mx'}
的形式,也可以是字符串。下面使用对象/键值对。
window.onload = function() {
$('[data-toggle="tabchange"]').click(function(e) {
var $this = $(this),
loadurl = $this.attr('href'),
targ = $this.attr('data-target');
//optional method call below, uncomment if needed
//loadurl = getDomainURL() + "/" + loadurl
$.get(loadurl, {
domain: 'google.com',
record: 'mx'
},
function(data) {
$(targ).html(data);
});
$this.tab('show');
return false;
});
}
//returns domain name: www.example.com in form of http://example.com
// or domain name: http://example.com is returned as it is, unchanged http://example.com
function getDomainURL() {
var index = window.location.hostname.indexOf("www.");
if (index === 0)
return "http://" + window.location.hostname.substr((index + 4));
else
return "http://" + window.location.hostname;
}
关于javascript - 通过 GET URL 加载 Bootstrap nav nav-tabs,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27647796/