匹配改写input值并自动添加前后缀

很意外我居然连续两天没有文荒哈哈哈哈哈
这JS可以用来为访客自动填写邮箱:比如你填了一个http://xiaohudie.net,然后邮箱输入框会自动写好admin@xiaohudie.net
以这段html为例:

<input type="text" name="url" id="url" >网址
<input type="text" name="email" id="email" >邮箱

JS

  1. 首先定义一个需要拿值的input
  2. function xhd(ooo){}

    给需要拿值的input加入onkeyup="xhd(this)"属性,让它变成ooo,也可以直接改写id,这个就比较多样了

  3. 然后是改写此input的value并传入另一个input
  4. document.getElementById("xxx").value= ooo.value.replace('http://', '')
    //把脱掉'http://'的ooo值写入xxx
  5. 添加前后缀
  6. 以网址转邮箱为例,我们需要添加的是[email protected]这样的前缀,一般以admin开头居多,所以这里用admin

    document.getElementById("email").value='[email protected]'+document.getElementById("xxx").value;
    //添加'[email protected]'前缀并写入email输入框

完整代码

<script>
function xhd(ooo){
document.getElementById("xxx").value= ooo.value.replace('http://', '')
document.getElementById("email").value='[email protected]'+document.getElementById("xxx").value;
}
</script>
<input onkeyup="xhd(this)" type="text" name="url" id="url" >网址
<input id="xxx" type="hidden" />
<input type="text" name="email" id="email" >邮箱

演示如下:

网址
邮箱

改进版:JS替换多个字符串(对上一篇的改进)

24 Comments

Name *

E-mail *

Website

  1. 胡倡萌

    测试了一下,但是如果有人填写的链接是带www的,邮箱的后缀就包含www了。或者如果是https:链接,那就又有问题了,所以所以,加些判断吧 :huai:

    • 小蝴蝶

      @胡倡萌 改好了 哈哈

      • 胡倡萌

        @小蝴蝶 测试效果出来了,但是貌似文章的代码没有更新?我看来看去,似乎和之前的一样 :meme:

        • 小蝴蝶

          @胡倡萌 刚发了一篇新的..哈哈~能凑一篇是一篇

  2. 我的名字叫麒

    不懂,友情顶帖!

  3. Mike

    好棒的东东~

  4. Cnjoel博客

    太专业了 只能路过···········

  5. Rilun

    感觉用处不大,还不如增加一个域名后缀选择呢 在或者是自动填充http://什么的

    • 小蝴蝶

      @Rilun 提供一个思路而已咯