javascript - MVC 4 Ajax 调用未进行

Question

这几天我一直在尝试解决我的应用中的问题，但我不知道发生了什么。

我正在开发一个 MVC 4 应用程序。我有一个 View ，其中有一个 div，我通过在 $(function() { ... }); 上执行的 ajax 调用加载了更多 html。该 ajax 调用工作正常。

当我进行第二次 ajax 调用时出现问题。我粘贴下面的代码:-

在主视图中:-

<div class="body" id="loadedData">

</div>

<script type="text/javascript" charset="utf-8">
   $(function(){
      loadData("@Url.Action("Authorizations","User", new { id = Model.ID })");
   });

   function loadData(url){
      $.ajax({
        type: 'GET',
        url: url,
        success: function (data) {
            $("#loadedData").html(data);
        }
    });
   }
</script>

在 div 中加载的部分 View 是这样的:

@if (ViewBag.UserAuths != null){
  <table>
      <tr>
          <th>
              Operations
          </th>
          <th></th>
      </tr>
      @foreach (var prod in ViewBag.UserAuths){
          <tr>
              <td>
                  @prod[0]
              </td>
              <td>
                 <a href="" onclick="loadData(@Url.Action("RevokeAccess", "User", new {    id = ViewBag.UserID, op = Int32.Parse(prod[1])}));">Remove</a>
              </td>
          </tr>
      }
  </table>
 }

当我单击由 ajax 加载的 HTML 中的链接(删除)时，就会出现问题。当我点击时，页面会“闪烁”，但没有任何反应。我在 UserController 的 RevokeAccess 函数中放置了一个断点，它永远不会停止。

请帮忙!

编辑:

还有一件事，当我点击链接时，在 Chrome 控制台中显示“未捕获的语法错误:意外的 token )”消息，但它很快就消失了，我不知道为什么。

Answer 1

当您使用 jQuery 时，请勿使用内联事件。使用 jQuery 绑定(bind)点击事件。当您获取部分 View 时，您可以使用 .load() ，这要简单得多。

脚本

<script type="text/javascript">
   $(function(){
       $("#loadedData").load("@Url.Action("Authorizations","User", new { id = Model.ID })");      

       $("#loadedData").on('click', '.anchor', function(event){
            event.preventDefault();//Stop default action  
            $("#loadedData").load(
                $(this).data('url'),  //Url
                { id: $(this).data('id'), op : $(this).data('op')}, //Parameters
                function(){
                    //Perform any action if any
                }
            );
       })
   });

</script>

将您的分音更改为

@if (ViewBag.UserAuths != null){
  <table>
      <tr>
          <th>
              Operations
          </th>
          <th></th>
      </tr>
      @foreach (var prod in ViewBag.UserAuths){
          <tr>
              <td>
                  @prod[0]
              </td>
              <td>
                 <a class='anchor' href="#" data-url='@Url.Action("RevokeAccess", "User")' data-id="@ViewBag.UserID" data-op="@Int32.Parse(prod[1])">Remove</a>
              </td>
          </tr>
      }
  </table>
 }