如何点击Atata框架的隐藏按钮?
How to click hidden button for Atata framework?
有一个可点击的按钮隐藏在我正在做的项目的一部分中。当鼠标悬停在上面时,它就会变得可见。我想点击隐藏按钮。我尝试了网站上写的大部分方法,但都没有成功。你有什么建议吗?
<div class="btn-group" style="visibility: hidden;">
<a class="btn btn-xs" title="Add" onclick="AddAction()">
<i clas="fa fa-plus-circle test-success"> == [=10=]
::before
</i>
</a>
</div>
因此,尽管您使用的是 visibility: hidden
,但我建议您改用 opacity
。这仍然像您期望的那样隐藏了按钮。请随时查看 W3 Schools 网站。它有很多很棒的资源,涵盖了像这样简单的事情。
我使用了该站点的以下参考资料:
function OnHover(element) {
element.style.opacity = 100;
}
function OnExit(element) {
element.style.opacity = 0;
}
function OnClick(element) {
element.innerHTML = "You clicked me as a hidden button!";
element.style.color = "red";
}
.btn {
visibility: hidden;
}
.btn:hover {
visibility: visible !important;
}
<button id="btnO" onmouseover="OnHover(this)" onmouseout="OnExit(this)" onclick="OnClick(this)" style="opacity: 0;">Opacity</button>
<button id="btnV" onclick="OnClick(this)" class="btn">Visibility</button>
我相信因为 visibility has been set to hidden
in your scenario, the page doesn't fire the events wired into the element. Even CSS selectors 等 hover
似乎受到此 属性 的影响。它似乎并没有减小元素的大小,因为实时通过开发人员工具更改元素的 visibility
不会影响页面的布局。但是,opacity
只是减少了元素上的 alpha 通道,所有事件仍会正常触发。
更多高级网络开发人员;如果我在上述陈述中有误,请随时纠正我。我找不到太多关于此的文档。
Tip: Hidden elements take up space on the page. Use the display property to both hide and remove an element from the document layout!
关于上面来自 W3 Schools 的引述,您可以创建一个空的 div
元素来放置您的按钮。然后,当用户将鼠标悬停在 div
元素上时,显示按钮或从 onclick
事件调用 javascript 函数。在这种情况下,您可以使用 visibility
属性,因为您不会直接与按钮交互,而是 div
.
有一个可点击的按钮隐藏在我正在做的项目的一部分中。当鼠标悬停在上面时,它就会变得可见。我想点击隐藏按钮。我尝试了网站上写的大部分方法,但都没有成功。你有什么建议吗?
<div class="btn-group" style="visibility: hidden;">
<a class="btn btn-xs" title="Add" onclick="AddAction()">
<i clas="fa fa-plus-circle test-success"> == [=10=]
::before
</i>
</a>
</div>
因此,尽管您使用的是 visibility: hidden
,但我建议您改用 opacity
。这仍然像您期望的那样隐藏了按钮。请随时查看 W3 Schools 网站。它有很多很棒的资源,涵盖了像这样简单的事情。
我使用了该站点的以下参考资料:
function OnHover(element) {
element.style.opacity = 100;
}
function OnExit(element) {
element.style.opacity = 0;
}
function OnClick(element) {
element.innerHTML = "You clicked me as a hidden button!";
element.style.color = "red";
}
.btn {
visibility: hidden;
}
.btn:hover {
visibility: visible !important;
}
<button id="btnO" onmouseover="OnHover(this)" onmouseout="OnExit(this)" onclick="OnClick(this)" style="opacity: 0;">Opacity</button>
<button id="btnV" onclick="OnClick(this)" class="btn">Visibility</button>
我相信因为 visibility has been set to hidden
in your scenario, the page doesn't fire the events wired into the element. Even CSS selectors 等 hover
似乎受到此 属性 的影响。它似乎并没有减小元素的大小,因为实时通过开发人员工具更改元素的 visibility
不会影响页面的布局。但是,opacity
只是减少了元素上的 alpha 通道,所有事件仍会正常触发。
更多高级网络开发人员;如果我在上述陈述中有误,请随时纠正我。我找不到太多关于此的文档。
Tip: Hidden elements take up space on the page. Use the display property to both hide and remove an element from the document layout!
关于上面来自 W3 Schools 的引述,您可以创建一个空的 div
元素来放置您的按钮。然后,当用户将鼠标悬停在 div
元素上时,显示按钮或从 onclick
事件调用 javascript 函数。在这种情况下,您可以使用 visibility
属性,因为您不会直接与按钮交互,而是 div
.