Question

我试图禁用浏览器＆＃39;保存密码＆＃39;功能（我的previous question）。为此，我在表单中添加了一个新的输入def schedule_params params.require(:schedule).permit(:title, :departure_date,{rooms_attributes: [:id, :_destroy, :room, :room_address, :schedule_id, :day, { amounts_attributes: [:itinerary_id, :room_id, :event_id, :id, :_destroy, :ccy, :amount]} ]} ) end字段，所以这是代码：

type="password"

注意：使用<form method="post" action="yoururl"> <input type="password" style="display:none"/> <input type="text" name="username" placeholder="username"/> <input type="password" name="password" placeholder="password"/> </form>无法使用现代浏览器。所以请不要提出建议。事实上，我尝试使用this approach。

问题是什么？当我隐藏autocomplete=false无用的输入时，它无法正常工作（我的意思是仍然保存密码选项）在那里。）。但是当我隐藏display:none无用的输入时，它就可以了。

如您所知，知名度属性占用了我不想要的页面空间。那么如何隐藏无用的输入以隐藏它并移除它的空间呢？

visibility:hidden很好，但是破坏了我添加无用输入的目的。
display:none并不好，因为它占用了页面上的空间。

那么还有另一种方式吗？

Answer 1

有许多可能的解决方案。

一个可能是：

input[type='password']:nth-of-type(1) {
visibility: hidden;
width: 1px;
height: 1px;
}

Answer 2

请参阅此answer。

我认为方法1最适合您，即将元素的width和height设置为0。

Answer 3

您可以通过此autocomplete="new-password"

停用自动填充功能

但是如果你想要删除空格，只需position absolute z-index: -9999;并将其隐藏在身体后面.fakepassword { visibility: none; position: absolute; z-index: -9999; }

function toggleA() {

    var list = document.getElementById("ListA");

    if (list.style.display == "none") {
    list.style.display = "block";
    } else {
        list.style.display = "none";
    }
}

如何隐藏元素？

3 个答案: