更改图像 alt 标签实际上并没有反映在浏览器中

changing image alt tag does not actually reflect in browser

这是我的 ajax 查询。它从服务器检索一些数据,淡出图像,更改图像然后淡入。

$(document).ready(function() {
    setInterval(function() {
        $.ajaxSetup({ cache: false });

        //alert("launching...");
        const rvtoken = $("input[name='__RequestVerificationToken']").val();
        const moduleId = @Dnn.ModuleContext.ModuleId;
        const tabId = @Dnn.ModuleContext.TabId;

        $.ajax({
            cache: false,
            dataType: 'json',
            url: "/DesktopModules/MVC/LH.Home/Home/GetAssociation",
            method: "Post",
            headers: {
                "ModuleId": moduleId,
                "TabId": tabId,
                "RequestVerificationToken": rvtoken,
                "AssociationID": $("#hfAssociationID").val()
            },
            success: function(data) {
                $("#associationDiv").fadeOut(3000,
                    function() {
                        $('#discoverLink').attr("href", `/Association/${data.Title}`);
                        $('#SelectedAssociationLink').attr("href", `/Association/${data.Title}`);
                        $('#SelectedAssociationImg').attr("src",
                        `/portals/@Dnn.ModuleContext.PortalId/assets/associations/${data.Slug}/images/img1.png`);
                        $('#SelectedAssociationImg').attr("alt", `${data.Title} icon`);
                    });
                    $("#associationDiv").fadeIn(3000);
                    $("#hfAssociationID").val(data.AssociationID);

                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(textStatus);
                    console.log(errorThrown);
                    console.log(jqXHR);
                }
            });
        },
        30000
    );
})

一切正常。 href链接改了,图片也改了。

问题出在图片的替代文字上。当我检查元素时,我可以看到它发生变化,但是当我翻转图像时,显示的 alt 标记文本是加载文档时的任何内容。

如何使滚动替代文本正确显示?

确保清除 Web 浏览器的缓存并在之后进行全面刷新 您对 javascript.

进行了编辑

发生这种情况的原因可能是浏览器在页面加载时存储了 alt 标记,然后不反映对其所做的任何更改,如果是这种情况,解决此问题的一种方法是简单地删除图像,并使用新属性重新插入它。

$('#SelectedAssociationImg').replaceWith("<img id='SelectedAssociationImg' src='newSrc' alt='newAlt'/>")

记得将 newSrcnewAlt 替换为您想要的任何内容。

alt 不是当您将鼠标悬停在图像上时显示的内容,title 是。