悬停时隐藏标题标签

2023-10-01前端开发问题
4

本文介绍了悬停时隐藏标题标签的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我查看了以前的问题,但没有一个对我真正有用,我检查了谷歌,发现的信息似乎很模糊,所以我想我会在这里尝试.

I've looked through previous questions and none of them have really worked for me, i've checked google to and the information I found seems pretty vague, so I thought i'd try here.

是否有人知道/或已经解决了在悬停时显示标题标签的问题.我有一系列链接和图像将被分配标题标签,但是,其中一些将显示最好不要在悬停时弹出的信息.

Is anyone aware/or have tackle the problem of title tags displaying on hover. I have a series of links and images that will be assigned title tags, however, some of them will be displaying information that would be better off not popping up on hover.

我可以使用一个全局函数将其应用于各种标题标签吗?一个例子如下:

Is there a global function I could use to apply this to all manner of title tags? An example would be as follows:

<a href="service.php" title="services for cars" />

如果可能,我想禁用悬停时出现的标题来自汽车的服务".

If possible I would like to disable the title "services from cars" appearing on hover.

再次感谢.

推荐答案

这应该可以很好地禁用单个标题:

This should work just fine to disable single title:

<a href="service.php" title="services for cars" onmouseover="this.title="';" />

如果你以后需要标题,你可以恢复它:

If you need the title afterwards, you can restore it:

<a href="service.php" title="services for cars" onmouseover="this.setAttribute('org_title', this.title'); this.title="';" onmouseout="this.title = this.getAttribute('org_title');" />

这种方式虽然不是通用的.. 要将其应用于所有锚点,请使用这样的 JavaScript 代码:

This way is not generic though.. to have it applied to all the anchors, have such JavaScript code:

window.onload = function() {
    var links = document.getElementsByTagName("a");
    for (var i = 0; i < links.length; i++) {
        var link = links[i];
        link.onmouseover = function() {
            this.setAttribute("org_title", this.title);
            this.title = "";
        };
        link.onmouseout = function() {
            this.title = this.getAttribute("org_title");
        };
    }
};

现场测试用例.

为更多标签应用相同的内容(例如<img>)首先将代码的核心移动到一个函数中:

to apply same for more tags (e.g. <img>) first move the core of the code to a function:

function DisableToolTip(elements) {
    for (var i = 0; i < elements.length; i++) {
        var element = elements[i];
        element.onmouseover = function() {
            this.setAttribute("org_title", this.title);
            this.title = "";
        };
        element.onmouseout = function() {
            this.title = this.getAttribute("org_title");
        };
    }
}

然后把代码改成:

window.onload = function() {
    var links = document.getElementsByTagName("a");
    DisableToolTip(links);
    var images = document.getElementsByTagName("img");
    DisableToolTip(images);
};

这篇关于悬停时隐藏标题标签的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

layui 实现实时刷新一个外部的div
主页面上显示了一个合计,在删除和增加的时候需要更改这个总套数的值: //html代码div class="layui-inline layui-show-xs-block" style="margin-left: 10px" id="sumDiv"spanSOP合计:/spanspan${totalNum}/spanspan套/span/div 于是在我们删除这个条数据后,...
2024-11-14 前端开发问题
156

layui要如何改变时间日历布局大小?
问题描述 我想改变layui时间日历布局大小,这个要怎么操作呢? 解决办法 可以用css样式对时间日历进行重新布局,具体代码如下: !DOCTYPE htmlhtmlheadmeta charset="UTF-8"title/titlelink rel="stylesheet" href="../../layui/css/layui.css" /style#test-...
2024-10-24 前端开发问题
271

jQuery怎么动态向页面添加代码?
append() 方法在被选元素的结尾(仍然在内部)插入指定内容。 语法: $(selector).append( content ) var creatPrintList = function(data){ var innerHtml = ""; for(var i =0;i data.length;i++){ innerHtml +="li class='contentLi'"; innerHtml +="a href...
2024-10-18 前端开发问题
125

layui弹出层layer.open中的content问题
如果content取的的事当前页面元素内容时,type类型应该为1 layer.open({type: 1,title: '内容区域',content: $('#DIV_EditUserInfo'), // 设置跳转的div,跳转到对应的页面area: ["920px", "250px"],}); 如果content取的的路径,或者某个页面,type类型应该为...
2024-10-15 前端开发问题
460

layui 表格的默认工具栏添加自定义按钮
首先定义table: var tableIns = table.render({ elem:'#businessUserListTable' ,url: ctx+'/business/businessUser/query' ,error:admin.error ,cellMinWidth: 80// ,width:3700 ,toolbar: '#businessUserListTable-toolbar' ,defaultToolbar: [{ title: '...
2024-06-12 前端开发问题
146

正则表达式([A-Za-z])为啥可以匹配字母加数字或特殊符号?
问题描述: 我需要在我的应用程序中验证一个文本字段。它既不能包含数字,也不能包含特殊字符,所以我尝试了这个正则表达式:/[a-zA-Z]/匹配,问题是,当我在字符串的中间或结尾放入一个数字或特殊字符时,这个正则表达式依然可以匹配通过。 解决办法: 你应...
2024-06-06 前端开发问题
165