在input 输入框前加个 ¥ 符号，然后输入框的字从后往前这是怎么做到的呢，求大神给个示例

Question

在input 输入框前加个 ¥ 符号，然后输入框的字从后往前这是怎么做到的呢，求大神给个示例，但是提交的时候咱们不要这个符号哦?，如何优雅的实现呢,

感谢楼下@vsion 大神

在多问一句啦 这种情况怎么让它后移动呀

---

加入 text-indent 即可，感谢大神解答

Answer 1

`1.

//placeholder默认事件
<input type="text" placeholder="¥"  dir="rtl"/>

`2.

//因为input不支持:after:before 所以可以用bgimg
input{ background-image: url(...) }

`3.

<style>
    div{
      position: relative;
    }
    input{
      position: relative;
      background-color: rgba(0,0,0,0)
    }
    .back{
      position: absolute;
      top: 2px;
      left: 5px;
      display: inline-block;
      color: rgba(1,1,1,0.5)
    }
</style>
<div>
    <input type="text"/>
    <div class="back">¥</div>
</div>

Answer 2

1、input 输入框前加个 ¥ 符号其实可以使用背景图片input{ background: url(...) left center no-repeat; }
2、至于输入内容从后往前输入，可以使用

            var input=document.querySelector("input");
            input.onkeyup=function(){
                var str=this.value;
                var last,start;
                last=start=str;
                last=last.slice(-1);
                start=start.slice(0,str.length-1);
                str=last+start;
                this.value=str;
            }