$ .ajax第一轮填充下拉列表不起作用

Question

我有一种情况，我点击一个动态链接它打开页面触发应该填充下拉列表的$ .ajax，如果我点击刷新然后填充下拉列表，同样认为如果我第一次点击另一个链接它没有更新下拉列表，但如果我重新登录浏览器并再次单击相同的链接，它会填充我错过的内容。 :)这个人有我。我已经在$（document）.read（）和$（window）.load（）之间移动了一些代码来测试。

$(window).load(function () {
    var value = GetParam("bookchapter");
    $("#bookName").change(function () {
        LoadChapters(this.value);
    });
    var bookparts = value.split(".");

    var bname = bookparts[0];
    var bchapt = bookparts[1];
    $('#chapter option').empty();
    $('#bookName').val(bname);
    LoadChapters(bname);
    $('#chapter').val(bchapt);
});
$(document).ready(function () {
    var indexno = $("#bookName").prop("selectedIndex");
    var bookname = $("#bookName>option:selected").text();
    LoadChapters(bookname);
    //$("#bookName").change(function () {
    //    LoadChapters(this.value);
    //});

    var loc = document.location.hash.substring(1);
    $(document.getElementById(loc)).css("color", "blue");
    $(document.getElementById(loc)).css("font-weight", "bold");

});

function LoadChapters(book) {

    $.ajax({
        type: 'GET',
        url: '/Book/LoadChapters',
        data: 'bookName=' + book,
        contentType: 'application/json; charset=utf-8',
        cache: false,
        dataType: 'json',
    }).done(function (data) {
        alert($('#chapter option').length);
        if ($('#chapter option').length > 0) {
            $('#chapter').empty();
        }
        $(data).each(function () {

            var option = new Option(this.Value, this.Label);
            $("#chapter").append(option);
        });

        var val = GetParam("bookchapter");

        var bookparts = val.split(".");

        var bname = bookparts[0];
        var bchapt = bookparts[1];
        $('#chapter').val(bchapt);

    });
};

function GetParam(name) {
    var value = "";
    if (window.location.hash) {
        var k = window.location.toString();
        value = k.substring(0, k.indexOf("#") );
    }
    else {
        value = window.location.toString();
    }
    if (value.indexOf("?")) {
        value = value.substring(value.indexOf("?") + 1, value.length);
        var params = value.split("&");
        if (params) {
            for (var i = 0; i < params.length; i++) {
                var pair = params[i].split('=');
                if (decodeURIComponent(pair[0]) == name)
                    return decodeURIComponent(pair[1]);
            }
        }
    }
    else {
        return "";
    }


}

index.cshtml

<h2>BOok</h2>
<form method="get" action="#">
@Html.DropDownList("bookName", (SelectList)ViewBag.bookName, "--Select--", "bookName")
@*(string)ViewBag.InBoek*@
@Html.DropDownList("chapter", Enumerable.Empty<SelectListItem>())

<button value="Submit" type="submit">Gaan na</button>

<table class="skrifkolom">
    <thead>
        <tr>
            <th>No</th>
            <th>Vers</th>
        </tr>

    </thead>
    @if (Model != null)
    {
        foreach (var item in Model)
        {
        <tr  id="@item.VersNommer">

            <td>@item.VersNommer</td>
            <td>@item.Vers</td>
        </tr> 
        }
    }
</table>


</form>