在div中隐藏某些字符

我正在寻找隐藏简单div中包含的某些字符的所有实例。
基本上我所追求的是，当页面加载某些字符（在这个例子中的'和'e'）将淡出，并留下空间的角色将在原来的句子。
这是据我已经走到这一步：
HTML：
<div id="test">hello this is a test this is a test</div>
的jQuery：
在div中隐藏某些字符

$(document).ready(function(){ 
$('#test').html($('#test').html().replace("s"," ")); 
$('#test').html($('#test').html().replace("e"," ")); 
});

这里有一个工作的jsfiddle太：http://jsfiddle.net/6vjt3/
但是这一切正在做的是隐藏第一个'和'e'在句子中，而不是其他的。
最好是我想要发生的事情是，jQuery会检测到这些字母，并慢慢淡化它们为白色，因此留下一个与字母成比例的空间，但不知道如何做到这一点。
任何建议将是伟大的！

来源

2012-12-04 user1374796

http://davidwalsh.name/javascript-replace这应该帮助... –

我试着做，因为你提到的衰落出来..见DEMOhttp://jsfiddle.net/6vjt3/3/

全码：

$(document).ready(function(){ 
    var charToReplace = ['s', 'e']; 
    $('#test').html(function (i, v) { 
     var resultStr = ''; 
     for (var i = 0; i < v.length; i++) { 
      var ch = v.charAt(i); 

      if ($.inArray(ch, charToReplace) >= 0) { 
       resultStr += '<span class="hideMe">' + ch + '</span>'; 
      } else { 
       resultStr += ch; 
      } 
     } 

     return resultStr; 
    }).find('.hideMe').fadeOut(1000, function() { 
     $(this).css('opacity', 0).show();    
    }); 

    //lets bring it all back 
    setTimeout(function() { 
     $('#test').find('.hideMe').css('opacity', 1); 
    }, 5000); 
});

使用表达式与g（全球）上取代。请参见

$('#test').html($('#test').html().replace(/s/g," ")); 
$('#test').html($('#test').html().replace(/e/g," "));

DEMO：http://jsfiddle.net/6vjt3/1/

来源

2012-12-04 20:48:46

这段代码很好，实际上完美！一个小问题，但由于某些原因使用此代码后，它不再在div内实现标签，是否有这样的理由？ – user1374796

+0

@ user1374796用'
'发表示例文本，我会研究它。 –

+0

我已经弄清楚了，但由于某种原因，当我将代码移到我的服务器上时，它根本无法工作？ http://www.nealfletcher.co.uk/fish/test/test不知道为什么 – user1374796

1

您需要将这些字符封装在SPAN中，然后淡出SPAN。使用替换会立即摆脱它们，但永远不会淡出。

来源

2012-12-04 20:49:17

2

如果以后需要回到原来的数据，我建议这种做法：

var $hiddenElement = $('<span>').addClass('hidden'); $('#test').html($('#test').html().replace(/s/g, $hiddenElement.text(s))); $('#test').html($('#test').html().replace(/e/g, $hiddenElement.text(s)));

你的CSS

.hidden { display: none; }

来源

2012-12-04 20:57:25 antonjs

在div中隐藏某些字符

回答

相关问题