Javascript 不使用ajax下载文件

我正试图遵循这一点来显示进度条，而不使用ajax下载文件

我使用knockout、html和webapi。我有下面的代码，在点击按钮事件时调用href

this.getMeData= function () {

    uRlPath("/api/GetSomeData?id=" + 12)
                + "&name=" + getName.toString()
                + "&downloadtoken=" + new Date().getTime());

    $('#myLink').click();

    location.href = $('#myLink').attr('href');


    };

这是我的html

   <tr>
            <td class="labelText">
                <button data-bind="click: getMeData">
                   Download Data
                </button>

            </td>
        </tr>
        <tr>
            <td>
               <a id="myLink" data-bind="attr: { href: uRlPath }" style="visibility: hidden">Open </a>
            </td>
        </tr>

非常准确地说，我希望具有与示例中提供的相同的行为。在这个例子中，他们使用表单提交，但我并没有任何表单，因为我只使用html，knockout。我已经包括了示例中提到的所有库

---

如果您需要更多输入，请务必通知我。

如果您只想在单击链接时调用blockUIForDownload函数，您可以通过“单击”绑定来完成，就像您对按钮所做的那样：

<a id="myLink" data-bind="attr: {href: uRlPath}, click: blockUIForDownload" style="visibility: hidden">Open</a>

---

我自己找到了解决办法。我使用下面的代码不断检查cookie

var attempts = 30;
var checkTime

        startProgressBar(true)

        checkTime= window.setInterval(function () {

            var cookieValue = $.cookie('downloadtoken');

            if ((cookieValue == token) || (attempts == 0)){
                 stopDownload();
            }
            attempts --;
        }, 1000);

在

finishDownload

函数中，我清除cookie并停止进度条

 function stopDownload() {
        window.clearInterval(checkTime);
        $.cookie('downloadtoken', null); //clears this cookie value
        stopProgressBar(false);
    }

这是进度条的html代码

 <div  data-bind="visible: stopProgressBar" style="top:248px;left: 320px;">
    <img src="../images/ProgressBar.jpg"  />
</div>

---

我需要与示例中提供的机制相同的机制。在这个例子中，他们使用表单提交，而我并没有任何表单提交，因为我使用了敲除和html。我想要的是在按钮上调用webapi服务。此服务返回我的pdf文件。所以我想显示一些进度条或其他东西，直到文件被下载。你提到我提供的例子了吗？我也不能使用window.open，因为它会打开新窗口。

 function stopDownload() {
        window.clearInterval(checkTime);
        $.cookie('downloadtoken', null); //clears this cookie value
        stopProgressBar(false);
    }

 <div  data-bind="visible: stopProgressBar" style="top:248px;left: 320px;">
    <img src="../images/ProgressBar.jpg"  />
</div>