0

jQueryのget（）ajax呼び出しから戻った後に問題が発生しました。応答は、divに追加のdivを入力します。これらの新しいdivには、「onclick」イベントハンドラーが含まれています。新しく入力されたdivをクリックして、「onclick」で起動する前に、ブラウザはページの任意の場所をクリックする必要があります。

編集「ajaxSearch」から「returnfalse」を削除し、「keypress」から「event.preventdefault（）」を削除することで解決しました

起こっていることの詳細は次のとおりです。

  1. 'srchKey'テキストボックスに値を入力し、Enterキーを押します
  2. 'ajaxSearch'関数が起動し、データを取得します。
  3. 'displayResults'関数は'searchResults'divを正常に更新し、最大10個のdivが左側に垂直にスタックされます。新しい'searchResult'divのそれぞれには、onclick ='resultClick（this、' / Path ...'、displayRecord）'が設定されており、' /Path...'はデータによって異なります。
  4. 'onclick'が起動する前に、ページのどこかをクリックする必要があります（どこでも構いません）。
  5. 最初のクリックの後、searchResult divの1つをもう一度クリックすると、「onclick」スクリプトが呼び出されます。

ユーザーには、「searchResult」divの1つを初めてクリックしても、何も起こらないように見えます。一度クリックした後、「searchResult」divのいずれかをそれ以降クリックするたびに、期待どおりに機能します。

この問題はブラウザに依存しないようです（少なくともChromeとFirefoxで同じことをする程度まで）。

私のページでは次のjqueryスクリプトを使用しています。

function displayResults(data) {
    $('.searchResults').html(data);
    return false;
}

function resultClick(selected, req, callback) {
    $('.searchResult').removeClass('selected');
    $(selected).addClass('selected');
    $.get(req, callback);
    return false;
}

function displayRecord(data) {
    $('#selectedRecord').html(data);
    return false;
}

function ajaxSearch() {
    $('#selectedRecord').empty();
    var myForm = $('#searchForm');
    $.post(myForm.URL, myForm.serialize(), displayResults);
    return false;
}

$(function () {
    $('#loadingDiv').hide();

    $('.watched').blur(ajaxSearch);
    $('#srchDate').blur(ajaxSearch);

    $(document).keypress(function (event) {
        if (event.which === 13) {
            event.preventDefault();
            ajaxSearch();
        }
    });
});

私のかみそりのページは次のようになります。

...

<div id="searchPage">
    @using (Html.BeginForm("Index","Controller",FormMethod.Post, new {id="searchForm"}))
    {
        <fieldset>
            <legend>Criteria</legend>
            <div class="search" id="srchKey">
                 @Html.LabelFor(m=>m.Key)
                 @Html.EditorFor(m=>m.Key)
            </div>
        </fieldset>
    }
    <div class="resultsBlock">
        <div class="searchResults" id="unitResults"></div>
        <div id="selectedRecord"></div>
    </div>
</div>

@section scripts
{
    <script src="@Url.Content("~/Scripts/search.js")" type="text/javascript"></script>
}
4

1 に答える 1

1

firebug を開いて net タブに切り替えると、最初のクリックが機能しているかどうかを確認できます。&lgt;div onclick='resultClick(this, '/Path...', displayRecord)' を手動で追加して、動作するかどうかを確認することもできます。

また、firebug に js エラーがあるかどうかも確認できます。

于 2013-01-08T02:51:18.067 に答える