Question

我的MVC视图中有一个图像标记，只有当控制器返回的布尔值为真时才显示。我编写了一个jquery函数，它在图像加载时被调用，后者又调用一个控制器方法并返回布尔值。但是，似乎永远不会在Image加载上调用jquery函数。我对Jquery的了解非常有限，不确定我是否正确地调用它。

 <div class="imageHolder">
     <img id="icon" data-userId="@Model.Users[i].Id" src="~/Images/Icon.png" onclick="location.href='/UserDetails/GetUserID?userID=@Model.Users[i].Id'" />
 </div>

Jquery函数：

$("#icon").load(function () {
            $.ajax({
             type: "POST",
             url:"UserDetails/CheckIfUserDataExists?userId=" + $('#icon').attr('data-userId'),
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: function (data) {
                    if (data == "true") {
                        $('#icon').show();
                    }
                    else {
                        $('#icon').hide();
                    }
              },
       });
   }

控制器方法：

[HttpGet]
        public ActionResult CheckIfUserDataExists(int userId)
        {
           if(userRepository.CheckIfUserHasData(userId))
            {
                return Json(true);
            }
           else
            {
                return Json(false);
            }
        }

先谢谢，

Answer 1

如果图像被缓存，图像将在绑定事件之前加载。试试下面的内容。

$("#icon").one("load", function () {
    $.ajax({
         type: "POST",
         url:"UserDetails/CheckIfUserDataExists?userId=" + $('#icon').attr('data-userId'),
         contentType: "application/json; charset=utf-8",
         dataType: "json",
         success: function (data) {
                if (data == "true") {
                    $('#icon').show();
                }
                else {
                    $('#icon').hide();
                }
          },
   });
}).each(function () {
    if (this.complete) $(this).load();
});

.one处理程序每个事件类型每个元素最多执行一次，因此它只运行一次。使用.each函数循环将确保它将触发加载事件，即使它被缓存。

Answer 2

在加载图片后运行代码的JQuery代码段：

$('#icon').attr('src', '~/Images/Icon.png').load(function () {
    // run Ajax code
    console.log('#icon image loaded');
});

如何在加载时调用jquery函数并返回布尔值MVC ASP.NET

2 个答案: