重新加载页面后图像不断消失

Question

我有一个调用MVC控制器的按钮。 控制器将特定的数据集带回到表中显示。 该页面完成后，我想根据所按下的按钮显示特定的图像。

我尝试了几种不同的方法来做到这一点。 它们似乎起作用，但是问题是，img不断消失。 我按了按钮。 似乎Jquery立即执行，显示正确的图像，然后控制器发送表和页面刷新的数据。 隐藏图像。

这是按钮的点击事件。

<script>
    $(document).ready(function () {
        var rowCount = $('#policyTable tr').length;
        $("span#policyCount").text(rowCount);

        $("#btnDawn").click(function (e) {
           $('span#uwPic').prepend('<img src= "/Images/dawnL.jpg" />');  
        })
   })   
</script>

同样，这可行，但是在页面加载后图像不会保留。

如何获得可粘贴的图像？

Answer 1

这肯定是猜测，但是一个常见的问题是您正在单击的html元素可能是<a href="..." id="btnDawn"></a> ，并且导航（href）正确执行点击。 为了防止导航，您的点击处理程序必须返回false 。

$("#btnDawn").click(function (e) {
    $('span#uwPic').prepend('<img src= "/Images/dawnL.jpg" />');
    return false; // <-- add this
})

Answer 2

由于上面@Bosco的想法，我得以找到解决方案。 调用控制器后，它将刷新页面以显示新调用的数据。 在页面刷新之前使Jquery调用过期。 就我而言，直到页面刷新和加载之后才进行Jquery调用，我本身并不太了解。 我猜是向前。

我有一个switch语句，该语句根据所按下的按钮返回某些视图。 我还返回一条TempData消息，该消息在视图中显示正确的图像。

  switch (month)
        {
            case "dawn":
                TempData["CB"] = "Dawn's";
                TempData["DL"] = "1";
                return View(DawnL);

            case "josh":
                TempData["CB"] = "Josh's";
                TempData["JB"] = "1";
                return View(JoshB);

            case "kyle":
                TempData["CB"] = "Kyle's";
                TempData["KB"] = "1";
                return View(KyleB);

            case "hank":
                TempData["CB"] = "Hank's";
                TempData["HW"] = "1";
                return View(HankW);

            default:
                TempData["CB"] = "All";
                return View(NextMonth2);
        }

在视图中，我使用它来查找正确的图像。

  <th>
        @if (TempData["DL"] != null)
        {
            <img src="~/Images/dawnLThumbNail.jpg" id="dawn" alt="Dawn Lambert" />
        }
        else if (TempData["JB"] != null)
        {
            <img src="~/Images/joshBThumbNail.jpg" id="jb" alt="Josh Beaman" />
        }
        else if (TempData["KB"] != null)
        {
            <img src="~/Images/kyleBThumbNail.jpg" id="jb" alt="Kyle Burgess" />
        }
        else if (TempData["HW"] != null)
        {
            <img src="~/Images/hankWThumbNail.jpg" id="jb" alt="Hank Wilson" />
        }
    </th>

这将在刷新后保持图像。 问题解决了。