突出显示jQuery函数和jQuery .toggle()函数

时间:2018-04-17 12:50:38

标签: javascript jquery

我有一个问题,我在网上浏览了一个附加到搜索功能的高亮功能。而且我找到了一个并且有效。

但我的问题是每当我进行搜索时,我的.toggle()jQuery根本不起作用。我试图在console.log中看到错误但没有显示

我只是想指出,当你不使用搜索功能时,toggle()函数会起作用,并且两个jQuery脚本都在他们自己的文件中。

我被要求制作一个“小提琴”,所以我做了。 https://jsfiddle.net/8puto9db/13/

但奇怪的是它可以在这里工作但不能在我的文本编辑器/浏览器中工作。

$("#Searchfield").keydown(function(event) {
  if (event.which == 13) {
    event.preventDefault();
    var searchTextBox = $("#Searchfield");
    searchTextBox.val(searchTextBox.val().replace(/(\s+)/, "(<[^>]+>)*$1(<[^>]+>)*"));
    var TextArea = $(".Mazzcontainer");
    var enew = "";
    if (searchTextBox.val() != '') {
      enew = TextArea.html().replace(/(<em>|<\/em>)/igm, "");
      TextArea.html(enew);
      var query = new RegExp("(" + searchTextBox.val() + ")", "gim");
      NewText = TextArea.html().replace(query, "<em>$1</em>");
      NewText = NewText.replace(/(<em>[^<>]*)((<[^>]+>)+)([^<>]*<\/em>)/, "<em></em>");
      TextArea.html(NewText);
    } else {
      enew = TextArea.html().replace(/(<em>|<\/em>)/igm, "");
      TextArea.html(enew);
    }
  } else {

  }
});


$("#Hide_p").click(function() {
  $(".Mazzcontainer").toggle();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<input id="Searchfield" name="q" class="form-control" required="" type="Text">
<button id="Hide_p">Click me!</button>

<p class="Mazzcontainer">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce quis lectus quis sem lacinia nonummy. Proin mollis lorem non dolor. In hac habitasse platea dictumst. Nulla ultrices odio. Donec augue. Phasellus dui. Maecenas facilisis nisl vitae nibh. Proin
  vel seo est vitae eros pretium dignissim. Aliquam aliquam sodales orci. Suspendisse potenti.
</p>

0 个答案:

没有答案