text_field_tag 里面的图标 (foundation-rails)

Icon inside text_field_tag (foundation-rails)

我正在使用 foundation-rails 创建注册表单。在 div 内:

<%= text_field_tag "password", "", placeholder: password", class:"password", required: true, type: "password" %>
<small class="error">Invalid</small> 

我想要一个 "show password" 或此字段内的图标(在右侧),单击它应显示密码。

如何在 text_field_tag 中放置一个很棒的字体图标???

<div class="password">
    <span class="fa fa-eye"></span>
    <%= text_field_tag "password", "", placeholder: password", class:"password", required: true, type: "password" %>
</div>

添加到css

.password {
    position: relative;
}

.password input { text-indent: 32px;}

.password .fa-eye { 
    position: absolute;
    top: 10px;
    left: 10px;
    cursor: pointer;
}

添加js脚本

<script>
    $('.password').find('.fa-eye').click(function(){
        $('#password').prop("type", "text");
    })
</script>