美文网首页前端杂货铺
JS在输入框内输入,替换文本里面的内容

JS在输入框内输入,替换文本里面的内容

作者: DarksidersJC | 来源:发表于2016-11-24 19:17 被阅读0次

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>

    <style>
        div{
            width: 300px;
            height: 200px;
            border: 5px solid #CCCCCC;
            margin-top: 30px;
        }
        
        
    </style>
</head>
<body>
    
    
    <input type="text" id="t1" />
    <input type="text"  id="t2" />
    <input type="button"  id="b1" value="替换"/>
    <div id="div1">
    正宗好凉茶正宗好声音欢迎收看由凉茶领导品牌加多宝为您冠名的加多宝凉茶中国好声音喝启力添动力娃哈哈启力精神保健品为中国好声音加油。本届中国好声音当中四位导师最得意的门生将踏上娃哈哈启力音乐梦想之旅。发短信参与互动立即获得苏宁易购的100元优惠券感谢苏宁易购对本节目的大力支持。我们的好声音学员如果获得三位或者三位以上导师认可即可获得苏宁易购提供的1万元音乐梦想基金。感谢上海新锦江大酒店为中国好声音导师提供的酒店赞助
    </div>
    
    <script type="text/javascript">
        var oT1 =document.getElementById('t1');
        var oT2 =document.getElementById('t2');
        var oB1 =document.getElementById('b1');
        var oDiv =document.getElementById('div1');
    
        
        
        
    
        
        
        oB1.onclick =function(){
        var j1 =document.getElementById('t1').value;
        var j2 =document.getElementById('t2').value;
            
            r=oDiv.innerHTML;

// for(var i=0;i<parseInt(r.length/j1.length);i++){
// r=oDiv.innerHTML;
// oDiv.innerHTML=r.replace(j1,j2);
// }
for(var i=0;i<r.length;i++){
r=oDiv.innerHTML;
oDiv.innerHTML=r.replace(j1,j2);
}

    }
        
        

        
        
        
    </script>
</body>

</html>

相关文章

网友评论

    本文标题:JS在输入框内输入,替换文本里面的内容

    本文链接:https://www.haomeiwen.com/subject/buxipttx.html