jquery trouve des mots-clés dans la zone de saisie et les met en surbrillance

Cette fois, je vais vous apporter jquery pour trouver des mots-clés dans la zone de saisie et les mettre en surbrillance. Quelles sont les précautions pour que jquery recherche et mette en évidence des mots-clés dans la saisie. box. , ce qui suit est un cas pratique, jetons un coup d'oeil.

L'exemple de code est le suivant :

<p>
  <a class="btn btn-success show" title="Popover title"
     data-container="body" data-toggle="popover" data-placement="bottom"
     data-content="底部的 Popover 中的一些内容"> aaaa </a>
</p>
<script>
  $(function () {
    initPopover();
  })
  function initPopover() {
    $(".show").popover({
      container: "body",
      trigger: " manual"  //手动触发
    }).on('show.bs.popover', function () {
      $(this).addClass("popover_open");
    }).on('hide.bs.popover', function () {
      $(this).removeClass("popover_open");
    });
    $(".show").click(function () {
      if ($(this).hasClass("popover_open")) {
        $(this).popover("hide")
      } else {
        $(".popover_open").popover("hide");
        $(this).popover("show");
      }
      var e = arguments.callee.caller.arguments[0] || event;
      e.stopPropagation();
    });
    $(document).click(function () {
      $(".show").popover("hide");
    });
  }
</script>

Remarque :

1. Non applicable aux boutons, a, img, etc. sont disponibles

2. show.bs.popover : cet événement est déclenché immédiatement lorsque la méthode show instance est appelée.

montré.bs.popover : cet événement est déclenché lorsque la boîte de dialogue contextuelle apparaît complètement (il attendra que l'effet de transition CSS soit terminé).

hide.bs.popover : cet événement est déclenché immédiatement lorsque la méthode d'instance hide est appelée.

Hidden.bs.popover : Cet événement est déclenché lorsque l' info-bulle est complètement masquée (attendra la fin de l'effet de transition CSS).

3. Présentez jquery et le fichier d'en-tête bootstrap

4. Annuler le bouillonnement

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Explication détaillée de l'utilisation du composant jquery.picsign

Explication détaillée des étapes d'ajout affectations aux éléments enfants avec jQuery

JS réalise une fonction de chargement et de pagination infinie sur le terminal mobile

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!