Question

我有一个textarea，当keyup在输入某个单词或短语时调用一个函数，但如果该单词或短语被删除，还会调用另一个撤消初始函数的函数。

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];


$("#id_message").on('keyup', function(){
      for(var i=0;i<phraseList.length;i++){
        if($('#id_message').val().toLowerCase().indexOf(phraseList[i]) > -1){
            doEgg();
        }else{
            undoEgg();
        }
      }
});

然而，在每个keyup上，indexOf的值暂时设置为-1，直到它遍历字符并找到有问题的单词。

所以这会导致doEgg（）;和undoEgg（）;快速连续地反复调用，这不是我想要发生的事情。

有没有办法计算.indexOf（）但是只有在文本区域被查看之后？所以它只为indexOf（）赋值一次。

据我所知，onChange不适用于我需要的东西，因为我希望函数作为人物类型而不是整个textarea完成时运行。

由于

EDIT。

被调用的函数是：

function doEgg(){
    // if(changeback)clearInterval(changeback);
    audioElement.play();
    // var change = setInterval(function () {
    change = setInterval(function () {
            var all = $('#wall_container').find('img').not('.easter');
            var random = Math.floor(Math.random()*all.length)
            var Rimg = $( all[random] )
            var cdown = all.length;
            var r = 1+Math.floor(Math.random()*33);

            Rimg.attr('data-oldsrc', Rimg.attr('src')).attr('src', 'http://localhost:8888/wp-content/uploads/crying/crying'+r+'.gif').addClass('easter');

            if(cdown==0){
                clearInterval(change);                    
            }

        }, 500)
}

function undoEgg(){
    // if(change)clearInterval(change);
    audioElement.pause();
    // var changeback = setInterval(function () {
    changeback = setInterval(function () {
        var all = $('#wall_container').find('img').filter('.easter');
        var random = Math.floor(Math.random()*all.length)
        var Rimg = $( all[random] )
        var cdown = all.length;

        Rimg.attr('src', Rimg.attr('data-oldsrc')).removeClass('easter');

        if(cdown==0){
            clearInterval(changeback);
        }
    }, 500)
}

Answer 1

你是什么意思？这样的事情？

＆＃13;

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];

$(function() {
  $("#id_message").on('keyup', function() {
      $("#result").empty();
      for(var i=0;i<phraseList.length;i++) {
        if($('#id_message').val().toLowerCase().indexOf(phraseList[i]) > -1){
            $("#result").append("found<br>");
        } else {
            $("#result").append("not found<br>");
        }
      }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input id="id_message">
<div id="result"></div>

＆＃13;

或者像这样：

＆＃13;

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];

$(function() {
  $("#id_message").on('keyup', function() {
      var $result = $("#result").empty();
      var val = this.value.toLowerCase();
      var words = phraseList.filter(function(e,i){ return val.indexOf(e)> -1 });
      if(words.length) {
        $result.append("found<br>");
      } else {
        $result.append("not found<br>");
      }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input id="id_message">
<div id="result"></div>

＆＃13;

编辑：您可以使用timeout为此设置延迟：

＆＃13;

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];

$(function() {
  var timeout = 0;
  
  $("#id_message").on('keyup', function() {
      clearTimeout(timeout);
      var $result = $("#result").empty();
      var val = this.value.toLowerCase();
      var words = phraseList.filter(function(e,i){ return val.indexOf(e)> -1 });
      timeout = setTimeout(function(){
        if(words.length) {
          $result.append("found<br>");
        } else {
          $result.append("not found<br>");
        }
      }, 500);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input id="id_message">
<div id="result"></div>

＆＃13;

那些500是毫秒，如果你希望它立即执行更多，请将其设置为更接近0而反之亦然

Answer 2

不要使用for循环。而不是indexOf使用inArray方法。

试试这段代码：

＆＃13;

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];


$("#id_message").on('keyup', function () {
    var value = $('#id_message').val();
    if ($.inArray(value, phraseList) != -1) {
        doEgg();
    } else {
        undoEgg();
    }
});
function doEgg() {
    alert("do");
}
function undoEgg() {
    alert("undo");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input type='text' id='id_message' />

＆＃13;

<强>更新

使用match这样的RegEx方法。

＆＃13;

var phraseList = [
    "foo foo",
    "foobar",
    "foobity foofoo foo"
];


$("#id_message").on('keyup', function () {
    var value = $('#id_message').val().toLowerCase(),
        flag = [];
    flag = $.map(phraseList, function (val) {
        var re = new RegExp("\\b" + val + "\\b","g");
        if (value.match(re))
            return val;
    });
    if (flag.length)
        doEgg();
    else
        undoEgg();
});
function doEgg() {
    alert("do");
}
function undoEgg() {
    alert("undo");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input type='text' id='id_message' />

＆＃13;

希望这能帮到你！

.on（'keyup'）计算.indexOf某个单词或短语

2 个答案: