JQuery 事件不适用于 ASP.NET MVC 部分 View

Question

我正在尝试让 JQuery 事件与 ASP.NET MVC 中的部分 View 一起使用。但是，通过 Ajax 加载分部 View 后，JQuery 似乎无法为分部 View 中的任何元素触发事件。我怀疑如果您使用其他框架或 JavaScript 库通过 Ajax 加载部分 html 代码，也会出现此问题。

例如，考虑以下示例:

Controller :

 public class TestController : Controller
    {

    public ActionResult Index()
    {
        return View();
    }

    public ActionResult LoadPartialView()
    {
        return View("PartialView");
    }
}

索引.aspx

     <script type="text/javascript">
         $(document).ready(function() {
             $("#button").click(function() {
                 alert('button clicked');
             });
         });   
     </script>    

     <div>
     <%using(Ajax.BeginForm("LoadPartialView", new AjaxOptions { UpdateTargetId="PartialView"})){ %>
        Click <input type="submit" value="here" /> to load partial view.
     <% } %>
     </div>
     <br /><br />
     <% Html.RenderPartial("PartialView"); %>

PartialView.ascx

<div id="PartialView">
   Click <input type="button" id="button" value="here"></input> to display a javascript message.
</div>

页面首次加载后，您可以单击“单击此处显示 Javascript 消息”，您将收到一条 Javascript 警报消息，显示“已单击按钮”。但是，一旦您单击“单击此处加载部分 View ”，单击本应带来 Javascript 警报消息的按钮不会产生任何效果。似乎“点击”事件不再被触发。

有谁知道为什么 JQuery 会出现此问题以及如何解决？使用事件的其他 JQuery 插件也会出现此问题。

Answer 1

我找到了解决方案:

尝试一下:

$(document).on("click", "YOUR_SELECTOR", function(e){
  /// Do some stuff ...
});

而不是:

$("YOUR_SELECTOR").on("click", function(e){
  /// Do some stuff ...
});