Difference between button onclick and a href

I'm trying to integrate SendOwl shopping cart into my application (details of the application are at the end).

To demo the problem I created a simple snippet using pure HTML / Javascript. In the head section of the HTML, I have this:

<script type="text/javascript">
    function SendOwl(url) {                 
        window.location.href=url;
    }
</script>
<script type="text/javascript" src="https://transactions.sendowl.com/assets/sendowl.js" ></script>

In the body I have this:

Example 1: Opens the checkout form in its own window (Undesired behavior):

<input type="button" onclick="SendOwl('https://transactions.sendowl.com/products/8/5C080C0F/purchase');" value="On Click" />

Screenshot 1: Notice the URL changed and it's not an overlay (compared to 2).

Example 2: Opens the checkout form in a modal window as an overlay (Desired behavior):

<a href='https://transactions.sendowl.com/products/8/5C080C0F/purchase'>a href</a>

Screenshot 2: The URL stays the same, but the form opens in an overlay.

You can also see a live demo on the SendOwl's demo page.

My application is based on GWT (SmartGWT to be precise). In my application, I call button onclick handler to invoke a Javascript that invokes the Buy Now link using JSNI call (shown below). But the Buy Now link always opens in a full window as in example 1 above.

public static native void onBuyNowClick(String url) /*-{
  $wnd.SendOwl(url);
}-*/;

I have tried $wnd.open(url) but that has the same behavior.

How do I get the first example to behave like the second but still using button onclick?

UPDATE:

The magic is in the sendowl.js script. If I remove that script, then both examples work the same way. If I could figure out how that script works, it might give some clues to make Example 1 work the same way as Example 2.

Thanks.