獲取json數據後jquery點擊事件沒有觸發

我正在使用jQuery處理Asp.Net MVC3應用程序。在特定頁面上，用戶被邀請輸入電話號碼以搜索公司。所以，有一個結果（_Result局部視圖），我點擊搜索按鈕時使用json獲得。獲取json數據後jquery點擊事件沒有觸發

另一方面，如果結果是在多個頁面上，當用戶點擊「下一步按鈕」時，什麼都不會發生。知道如果我點擊「搜索」按鈕之前點擊「下一步」按鈕，我就會觸發我的點擊事件。

Next按鈕位於_Result局部視圖中。

這裏是我的代碼HTML /剃刀：

<div> 
<div> 
    <span>Téléphone ?</span> 
    <input id="idTxTel" type="text" name="txTelephone"/> 

    <input id="idBnSearch" type="submit" value="Chercher" name="bnSearch"/> 
</div> 

@Html.Partial("_Result", Model) 
</div>

在_result局部視圖

<div> 
    <span>Page N sur M</span> 
    <input id="bnPreviousPage" type="submit" value="Précédant" name="bnPrevious"/> 
    <input id="bnNextPage" type="submit" value="Suivant" name="bnNext"/> 
</div>

這裏是我的JS代碼：在其他

<script type="text/javascript"> 
$(document).ready(function() 
{ 
    $("#idBnSearch").click(function() 
    { 
     var telValue = $("#idTxTel").val(); 
     var methodUrl = '@Url.Content("~/Search/GetReverseResult/")'; 

     doReverseSearch(telValue, 0, methodUrl); 
    }); 

    $("#bnNextPage").click(function (e) 
    { 
     alert("Next cmd"); 
    }); 
}); 
    </script>

我「doReverseSearch」方法JS檔案

function doReverseSearch(telValue, pageIdx, methodUrl) 
{ 

    $.ajax(
     { 
      url: methodUrl, 
      type: 'post', 
      data: JSON.stringify({ Telephone: telValue, pageIndex: pageIdx }), 
      datatype: 'json', 
      contentType: 'application/json; charset=utf-8', 
      success: function (data) { 
       $('#result').replaceWith(data); 
      }, 
      error: function (request, status, err) { 
       alert(status); 
       alert(err); 
      } 
     }); 
}

在此先感謝

來源

2012-07-14 SidAhmed

如果你添加''ajax'通話 – 2012-07-14 17:15:01

後返回TRUE;不，不工作！ – SidAhmed 2012-07-14 17:16:55

所以，成功沒有被調用或$（'＃result'）。replaceWith（data）;不管用？如果調用成功，則用調試器（firebug或chrome調試器）進行測試。 – Ando 2012-07-14 17:47:59

的問題是，你在#bnNextPage click事件訂閱當文檔準備好，但在阿賈克斯成功更換DOM其中#bnNextPage原本的一部分。因此，您的點擊訂閱現在是活躍的，只有當您還沒有搜索時才能使用。

爲了使它工作，你需要在阿賈克斯成功的單擊事件重新訂閱：

success: function (data) { 
       $('#result').replaceWith(data); 
       $("#bnNextPage").click(function (e) 
       { 
        alert("Next cmd"); 
       }); 
     },

或者儘可能多更好的解決方案：jQuery提供「持久」訂閱與live方法。如果您修改原始點擊代碼：

$("#bnNextPage").click(function (e) { alert("Next cmd"); });

到

$("#bnNextPage").live("click", function (e) { alert("Next cmd"); });

它將工作，而無需修改您的success回調。

請注意，由於JQuery 1.7的live方法已被棄用，您應該使用on方法。在你的情況下，訂閱看起來像on如下：

$(document).on("click", "#bnNextPage", function (e) { alert("Next cmd"); });

來源

2012-07-14 18:01:53 nemesv

+1 - 最初看到'live（）'部分並且認爲 - 呃，但是接着說'.on（）'並且認爲，很好地解釋:) – 2012-07-14 19:09:25

好的，謝謝你，live（）方法解決了它 – SidAhmed 2012-07-15 07:31:26

With JQuery 1.8，通過on（）將事件附加到文檔可以讓我的事件始終工作，謝謝 – bob 2012-12-21 02:00:06

獲取json數據後jquery點擊事件沒有觸發

回答

相關問題