html在文本框中显示内容,js如何实现点击标签文字,文字在文本框出现

js实现点击标签文字,文字出现在文本框里,下面2种方法实现的功能略有不同,总体来说方法一功能更强大。

第一种方法:随意点击任何标签都会出现在文本框中,如何第二次点击标签,对应的文字就会在文本框中消失。

市级,
省级,
国家级

var x=["市级","省级","国家级"];

var y=[];

function $(id){ return document.getElementById(id)};

for(var i=0,m=x.length;i

var s=y.join(",").indexOf(x[i]);if(s>=0){

for(var r in y){if(y[r]==x[i]){y.splice(r,1)}}}

else{y.push(x[i])}$("i").value=y.join(" ");}})(i)}

效果图:

937af4cca59f55323cda3706edaf9cb2.png

第二种方法:当点击“脚本之家”标签的时候,此标签就出现在了文本框里,再点击SQL标签后,“SQL”标签就会替换掉“脚本之家”标签出现在文本框中。

JS特效

C++

SQL

脚本之家

spans=document.getElementsByTagName("span");

for(i=0;i

{if(spans[i].className=="label")

{ spans[i].οnclick=function()

{ document.getElementById('textbox').value=this.innerHTML;

}}}

效果图:

073e2291e99cd19312e4752cab16a92d.png

这里再为大家分享另一个Javascript的小技巧-----JS实现点击文本框清除表单内部默认文字,有时大家在填写表单内容时,表单里会出现一些默认提示文字,我们又不想一个个删除,有什么办法可以实现快速清除?下面就是我为大家准备的小代码:

onBlur="if(!value){value=defaultValue;}"

value="请输入的关键词">

效果图:

9c50cdd436ec0ec1e751ca747d78dae6.png

点击文本框之后

f63cf03405576ee226176b5078c56ef3.png

以上就是本文的全部内容,希望对大家的学习有所帮助。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值