单击按钮后，jQuery UI选项卡将刷新

Question

我有jQuery UI标签页：

<div class="addTheatreContainer">

    <div class="addTheatreHeader">
        <span class="txtLightboxTitle">ADD THEATRE</span>
    </div><!--end/ .addTheatreHeader-->


    <!-- Tabs -->
    <div id="tabs">

        <ul>
            <li>
                <a href="#tabs-1 B.C.">1 B.C.</a>
            </li>
            <li>
                <a href="#tabs-2 Alberta">2 Alberta</a>
            </li>
        </ul>
        <div id="#tabs-1">
            <table class="table5">
                <tr>
                    <td width="20">
                        <fieldset class="checkboxes">
                            <label class="label_check">
                                <input name="ctl10" type="checkbox" />
                            </label>
                        </fieldset>
                    </td>
                    <td width="40">ID</td>
                    <td width="120">Location</td>
                    <td width="120">Region</td>
                    <td width="120">City</td>
                    <td width="70">Province</td>
                </tr>
            </table>
        </div>
        <div id="#tabs-2">
            <table class="table5">
               <tr>
                    <td width="20"><fieldset class="checkboxes"><label class="label_check"><input name="ctl22" type="checkbox" /></label></fieldset></td>
                    <td width="40">ID</td>
                    <td width="120">Location</td>
                    <td width="120">Region</td>
                    <td width="120">City</td>
                    <td width="70">Province</td>
                </tr>
            </table>
        </div>
    </div><!--end/ #tabs-->
    <div class="ButtonAlignRight">
            <button id="btnAddAndCloseTheatre" runat="server" class="btnAddandCloseTheatre"  >Add & Close</button>
            <button id="btnAddTheatre" runat="server" class="btnAddTheatre" onclick="AddLocations()">Add</button>
            <button id="btnClose" runat="server" class="btnClose">Close</button>
    </div>
</div>

点击添加按钮。整个页面刷新，我不想要它，因为我将值存储在全局变量中。

JS：

function AddLocations()
{
    var allChecboxes = $("#tabs").tabs("options", "active").find(".checkboxes");

    var allCheckedLocations = allChecboxes.find(".cbLocation").each(function () {
        var checkbox = $(this);
        if (checkbox.prop("checked") ==  true) 
        {
            var checkboxId = checkbox.attr("id");
            var locationId = parseInt(checkboxId.replace("cbLocation_", ""));
            if (typeof (locationId) == "number" && isNaN(locationId) == false) {
                AddedLocationsList.push(locationId);
            }
            //checkbox.parents(".row").fadeOut();
        }
    });

}

AddedLocationsList是一个全局变量。此函数完美地运行但是由于页面被刷新，变量被设置回[]。我不知道为什么页面会被刷新。有没有jQuery UI回调？