Loader occurring multiple times

one_btn.addEventListener(MouseEvent.MOUSE_UP, buttonAction);
two_btn.addEventListener(MouseEvent.MOUSE_UP, buttonAction);
three_btn.addEventListener(MouseEvent.MOUSE_UP, buttonAction);
four_btn.addEventListener(MouseEvent.MOUSE_UP, buttonAction);
var container_mc:MovieClip = new MovieClip();
container_mc.x = 0;
container_mc.y = 0;

addChild(container_mc);

MovieClip(loadbar).alpha = 0;
MovieClip(stroke_mc).alpha = 0;

function buttonAction(e:MouseEvent):void {
    MovieClip(loadbar).alpha = 100;
    MovieClip(stroke_mc).alpha = 100;
    var t:String = String(e.target.name);
    var a:Array = String(t).split("_");
    var the_url:URLRequest = new URLRequest();
    the_url.url = "images/" + a[0] + ".jpg";
    
    var the_loader:Loader = new Loader();
    the_loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onLoaderProgress);
    the_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderComplete);
    while (container_mc.numChildren > 0) {
        container_mc.removeChildAt(0);
    }
    the_loader.load(the_url);
}
function onLoaderProgress(e:Event):void {
    MovieClip(loadbar).scaleX = e.target.bytesLoaded / e.target.bytesTotal
}
function onLoaderComplete(e:Event):void {
    container_mc.addChild(e.target.content);
    e.target.addEventListener(ProgressEvent.PROGRESS, onLoaderProgress);
    e.target.addEventListener(Event.COMPLETE, onLoaderComplete);
    MovieClip(loadbar).alpha = 0;
    MovieClip(stroke_mc).alpha = 0;
}

Whenever I load something, if I click a second button while one of the others is in the process of loading the previous one continues to load. So if I clicked button 1 then clicked button 2 while button 1’s content was still loading, the content for button 1 still loads and when its finished it shows.

How do I remedy this? In AS2 a container would only hold one external clip at a time, but that is no longer the case and I’m kind of at a loss here.

Thanks.