Javascript Ctrl+；单击渲染局部视图的链接

我得到了一个使用AJAX渲染局部视图的链接

这是我的链接代码：

<a href="#" onclick="LoadChildCategories(@i.CategoryId,  
    @i.IsTrading.ToString().ToLower())">@i.Name</a>

当我在不使用CTRL键的情况下单击它时，可以将部分视图渲染到我的div中。但当我使用CTRL键单击它时，部分视图渲染到当前选项卡中，然后在索引页打开另一个选项卡

当我右键单击链接并选择在另一个选项卡中打开它时，当前选项卡上什么也没发生，新选项卡在索引页上打开

---

那么，有什么方法可以解决这个问题吗？

我发现了一个非常好的解决方案，所以我根据这个解决方案修改了项目：

1） 使控制器方法返回视图，而不是PartialView，并添加一行代码，然后检查是否是AJAX请求：

public ViewResult Category(int id)
{
    ViewBag.IsAjaxRequest = Request.IsAjaxRequest();
    var node = CategoriesHandler.Instance.First(x => x.CategoryId == id);
    var childCategories = CategoriesHandler.Instance.Where(x => x.ParentId == node.Id).ToList();
    ViewBag.Message = node.Name;
    return View(childCategories);
}

2） 编辑_ViewStart.cshtml，如下所示：

@{
    Layout = ViewContext.ViewBag.IsAjaxRequest == true ? null : "~/Views/Shared/_Layout.cshtml";
}

$(function () {

var contentShell = $('#bodyContent');

var History = window.History, State = History.getState();

$(".ajaxLink").on('click', function (e) {
    e.preventDefault();
    var url = $(this).data('href');
    var title = $(this).data('title');
    History.pushState(null, title, url);
});

function navigateToURL(url) {
    $('#bodyContent').html('<div class="loader"> </div>');
    $.ajax({
        type: "GET",
        url: url,
        dataType: "html",
        cache: false,
        success: function (data, status, xhr) {
            $('#bodyContent').hide();
            contentShell.html(data);
            $('#bodyContent').fadeIn(500);
        },
        error: function (xhr, status, error) {
            $('#bodyContent').hide();
            alert("TEST_Error");
        }
    });
}

History.Adapter.bind(window, 'statechange', function () {
    State = History.getState();
    if (State.url === '') {
        return;
    }
    navigateToURL(State.url);
});});

3） 准备要通过AJAX管理的链接：

<a href="@Url.Action("Category", "Intech", new { id = i.CategoryId })" class="ajaxLink" data-href="@Url.Action("Category", "Intech", new { id = i.CategoryId })" data-title="@i.Name">@i.Name</a>

4） 在_Layout.cshtml上为视图创建容器

@/*Some layout stuff*/
<div id="bodyContent">
 @RenderBody()
</div>
@/*Other layout stuff*/

@/*一些布局材料*/
@RenderBody（）
@/*其他布局材料*/

5） 准备帮助程序javascript文件，如下所示：

@{
    Layout = ViewContext.ViewBag.IsAjaxRequest == true ? null : "~/Views/Shared/_Layout.cshtml";
}

$(function () {

var contentShell = $('#bodyContent');

var History = window.History, State = History.getState();

$(".ajaxLink").on('click', function (e) {
    e.preventDefault();
    var url = $(this).data('href');
    var title = $(this).data('title');
    History.pushState(null, title, url);
});

function navigateToURL(url) {
    $('#bodyContent').html('<div class="loader"> </div>');
    $.ajax({
        type: "GET",
        url: url,
        dataType: "html",
        cache: false,
        success: function (data, status, xhr) {
            $('#bodyContent').hide();
            contentShell.html(data);
            $('#bodyContent').fadeIn(500);
        },
        error: function (xhr, status, error) {
            $('#bodyContent').hide();
            alert("TEST_Error");
        }
    });
}

History.Adapter.bind(window, 'statechange', function () {
    State = History.getState();
    if (State.url === '') {
        return;
    }
    navigateToURL(State.url);
});});

$（函数（）{
var contentShell=$（“#bodyContent”）；
var History=window.History，State=History.getState（）；
$（“.ajaxLink”）。在（'click'，函数（e）{
e、 预防默认值（）；
var url=$（this.data（'href'）；
var title=$（this.data（'title'）；
pushState（null，title，url）；
});
函数导航url（url）{
$（'#bodyContent'）.html（''）；
$.ajax({
键入：“获取”，
url:url，
数据类型：“html”，
cache:false，
成功：功能（数据、状态、xhr）{
$（'#bodyContent'）.hide（）；
html（数据）；
$（#bodyContent'）.fadeIn（500）；
},
错误：函数（xhr、状态、错误）{
$（'#bodyContent'）.hide（）；
警报（“测试错误”）；
}
});
}
History.Adapter.bind（窗口'statechange'，函数（）{
State=History.getState（）；
如果（State.url==''）{
返回；
}
navigateToURL（State.url）；
});});

---

6） 别忘了将javascript文件包含到包中

这就是应该发生的事情（不要尝试更改浏览器的默认行为）是的，我知道，但是在新选项卡上渲染局部视图有什么解决方法吗？