如何使用 Ajax 成功在新选项卡中打开 URL？

Question

在这里，我试图通过使用 Ajax Success 调用 Doctor 控制器的 ViewFile 操作在新选项卡中打开文件，该操作位于 functionabc(this) 中，单击锚标记。
现在的问题是一切都按要求进行，但 url 没有在新选项卡中打开。

下面是我的 Ajax

<script>
function abc(thisEvent) {
    debugger;
    var getDoCredId = $(thisEvent).attr('docCredId');
    var parameter = { id: getDoCredId };
    $.ajax({
        url: "/Doctor/ViewFile1",
        type: "get",
        dataType: "html",
        data: parameter,
        success: function (data) {
            debugger;
            if (data = true) {
                debugger;
                var getdoctorId = $(thisEvent).attr('docCredId');
                var url = "/Doctor/ViewFile/" + getdoctorId;
                window.open(url, "_blank");
            }
            else {
                debugger;
                showNotification("Error", "warning");
            }
        }
    });
}

下面是我的锚标记 HTML

<a title="View Attachment"   docCredId = "' + getDocCredId + '"  onclick="abc(this)"><i class="btn btn-web-tbl btn-warning fa fa-eye "></i></a>

下面是后面的代码

public bool ViewFile1(int id)
    {
        var document = _doctorService.GetDoctorCredentialDetails(id);
        string AttachPath = ConfigPath.DoctorCredentialsAttachmentPath;
        string strFileFullPath = Path.Combine(AttachPath, document.AttachedFile);

        string contentType = MimeTypes.GetMimeType(strFileFullPath);
        bool checkFileInFolder = System.IO.File.Exists(strFileFullPath);
        if (checkFileInFolder == true)
        {
            return true;
        }
        else
        {
            return false;
        }
  }
    public ActionResult ViewFile(int id)
    {
        var document = _doctorService.GetDoctorCredentialDetails(id);
        string AttachPath = ConfigPath.DoctorCredentialsAttachmentPath;
        string strFileFullPath = Path.Combine(AttachPath, document.AttachedFile);
        string contentType = MimeTypes.GetMimeType(strFileFullPath);
        bool checkFileInFolder = System.IO.File.Exists(strFileFullPath);  
        bool filedata = System.IO.File.ReadAllBytes(strFileFullPath).Any();
        byte[] filedata1 = System.IO.File.ReadAllBytes(strFileFullPath);
        var cd = new System.Net.Mime.ContentDisposition
        {
            FileName = document.FileName,
            Inline = true
        };
        Request.HttpContext.Response.Headers.Add("Content-Disposition", cd.ToString());
        return File(filedata1, contentType);
    }

Answer 1

由于这对于常规评论来说太长了，因此我将其发布为答案，尽管它不能直接解决问题，因为我无法重现它，但可能会提供一些见解并让与此简化示例相比，您可以检查代码中发生的情况的差异。

---

从 jQuery ajax 成功回调调用 window.open() 工作正常：https://codepen.io/nomaed/pen/dgezRa

我使用了与您相同的模式，但没有使用您的服务器代码，而是使用 jsonplaceholder.typicode.com 示例 API。

---

您可能需要考虑代码示例的一些问题，即使您没有向 cmets 询问它并且它与您的问题没有直接关系（可能）：

1. if (data = true) 表示数据始终为真。如果您知道它是一个布尔值，您可能意味着执行 if (data === true)，或者如果您想接受任何真实值（true、{}、“某物”、42 等），则执行 if (data)。从 Java 代码以及您在 jQuery ajax 调用中定义响应格式的方式来看，您似乎期望“数据”变量结果是 HTML 而不是布尔值。您可能想尝试删除dataType: "html" 行并让jQuery 根据从服务器返回的内容设置数据格式，和/或发送JSON 格式的响应，如{ result: true } 的POJO 中的成功响应.然后确保data.result === true 确保你得到了你所期望的。

2. 您可能应该将任意数据添加到标记 DOM 元素 data-* attributes，如果您使用的是 jQuery，请使用 .data() 选择器访问它们。 White 添加带有字符串值的随机属性可能会起作用，这被认为是对 HTML 和 DOM 的滥用，而 data-* 属性专门用于添加任何数据。

3. 在abc() 函数中，您在开始时获取属性的值 (var getDoCredId = $(thisEvent).attr('docCredId');)，但在回调中您试图再次获取该值。你真的不需要它，因为 success() 回调是 abc() 函数范围内的一个闭包，并且它已经可以访问该值，因此确实不需要在回调中执行 var getdoctorId = $(thisEvent).attr('docCredId');。

4. 我还建议将 getDoCredId 变量命名为 docCredId。有一个“get”前缀通常意味着它是一个 getter 函数或对某个 getter 的引用。同样，主函数的“thisEvent”参数可能应该被称为“callerElement”或类似的名称，因为它不是一个事件，它是一个实际元素，您在调用abc(this) 时直接从 DOM 传递在<a> 锚点的 onClick 事件处理程序中。这只是为了让任何正在阅读它的人更清楚地理解代码，以及当你在未来几个月回到它并试图弄清楚发生了什么时你自己:)

Answer 2

尝试将async: false 添加到您的 Ajax 请求中

function abc(thisEvent) {
    debugger;
    var getDoCredId = $(thisEvent).attr('docCredId');
    var parameter = { id: getDoCredId };
    $.ajax({
        async: false, // <<<----------- add this
        url: "/Doctor/ViewFile1",
        type: "get",
        dataType: "html",
        data: parameter,
        success: function (data) {
            debugger;
            if (data = true) {
                debugger;
                var getdoctorId = $(thisEvent).attr('docCredId');
                var url = "/Doctor/ViewFile/" + getdoctorId;
                window.open(url, "_blank");
            }
            else {
                debugger;
                showNotification("Error", "warning");
            }
        }
    });
}