Question

我一直试图在我的应用中解决问题几天，我无法弄清楚发生了什么。

我正在开发一个MVC 4应用程序。我有一个视图，其中有一个div，我加载了更多的html与a $(function() { ... });执行的ajax调用。那个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中加载的部分视图就是这样：

@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控制台中显示“未捕获的SyntaxError：意外的令牌”消息，但它消失得很快，我不知道为什么。

Answer 1

当您使用jQuery时，请不要使用内联事件。使用jQuery绑定click事件。在获取部分视图时，您可以使用更简单的.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>
 }

没有进行MVC 4 Ajax调用

1 个答案: