javascript - 在行中找到某些文本,然后隐藏这些行

标签 javascript jquery css

我正在运行一个浏览每一行的 javascript。我希望能够搜索每一行,如果该行包含特定文本,则隐藏该行。例如:

  <input id="search" type="button" value="Run" />
  <textarea id="main" style="height:150px;">
   300 300 300
   300 200 300
   100 100 150
  </textarea>

Javascript

$('#search').bind('click', function () {
    var lines = $("#main").val().split("\n");
    for (var i = 0; i < lines.length; i++) {
        if($([i].contains('300' || '200'){
            $(lines).css('display','none');
        }
    }

});

代码会换行,因此在本例中是 3 行。但是我如何告诉它从每一行中找到某些文本并且不显示该行而不是仅仅取出数字。所以从上面的输出将是:

    100 100 150

最佳答案

您需要替换整个文本区域值。由于 textarea 仅包含文本,因此每一行都没有可以隐藏或以任何方式设置样式的内部 html...全有或全无

以下过滤拆分数组然后使用换行符作为分隔符将其连接回去

$('#search').on('click', function() {
  $("#main").val(function(_, oldVal) {   
    return oldVal.split('\n').filter(function(str) {
      return str.indexOf('200') === -1 && str.indexOf('300')=== -1
    }).join('\n');
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="search" type="button" value="Run" />
<textarea id="main" style="height:150px;">
  300 300 300
  300 200 300 
  100 100 150
</textarea>

关于javascript - 在行中找到某些文本,然后隐藏这些行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38054184/

相关文章:

javascript - 使用不同的浏览器通过 getUserMedia 获得一致的音频质量

jquery - 如何在没有 API key 的情况下在 jQuery 中获取 Google Plus 分享计数?

javascript - 如何定位在其父元素中具有类的子元素?

css - :after pseudo-element content lost when pasted into editor 中的换行符

javascript - Vue 组件在 <template> html 标签中不可见

javascript - 如何在列表中随机数量的标签的单词中剪切部分字符串?

javascript - 单击行时更改引导行中的字形

javascript - PLUpload 获取剩余文件?

css - css3派有多可靠

javascript - 如何使用 XML 文档更新 HTML 文本?