Catch insecure response error in mixed content situation

Question

I noticed when I try to display data in an iframe of a modal popup from a site that uses http when application is running https, I get blank screen. Looking at browser console I noticed the message:

"Mixed content: The page at https://MyApp/SomePage/' was loaded over https. but requested an insecure HTMLHttpRequest endpoint 'http://TheOtherSite'. This request has been blocked, the content must be served over https'.

I have no control over "TheOtherSite" and "MyApp" must use https. So, instead of displaying a blank popup, I need to display something to tell the use why s/he is seeing blank screen.

I changed:

$(document).on('click', 'extLink', function () {
    var frametarget = $(this).attr('href');
    $('#lblModalTitle').text(blahblah');
    $('#modaliframe').attr("src", frametarget);  // Modal body has an iframe with id of "modaliframe"
}

to:

$(document).on('click', 'extLink', function () {
    var frametarget = $(this).attr('href');
    $('#lblModalTitle').text(blahblah');

    var request = new XMLHttpRequest();
    request.open('GET', frametarget, true);

    request.onload = function () {
        $('#modaliframe').attr("src", request.responseText);
        console.log(request.responseText);
    };
    request.onerror = function () {
        console.log(request.responseText);
    };
    request.send();
}

But it always falls into .onerror where responseText is blank and status" is 0.

Is there any way I can catch this error and display it?