Question

我需要创建一个在其上添加了文本字段的网页。我已经为文本字段设置了一个ID（例如，“ custom”）。现在，如果文本字段包含某些单词，我想修改网页。

例如，如果文本字段包含一个单词，例如苹果，我想做点什么。

如果文本字段包含ball，我想做其他事情。

以此类推。

我发现了：

<script>
var check=document.getElementById("custom").value == "text_value";
//check will be true or false
if (check){ //do something if true}
if(!check){//do something if false}
</script>

我什至不知道它是否正确，但是，我意识到，它无法管理多个条件。因为，如果文本包含苹果，则不包含球，则会产生奇怪的行为。

那么，我该如何实现呢？

Answer 1

查看以下 Vanilla JavaScript （普通JavaScript）示例。

即输入bla bla apple，您会得到预期的结果。

function doSomething() {
  var text = document.getElementById("myInput").value;

  if (text.includes("apple")) {
    console.log("do something special because text contains apple");
  }
  else if (text.includes("ball")) {
    console.log("do something special because text contains ball");
  }
  else {
    console.log("text contains no special word");
  }
}

Enter text: <input type="text" id="myInput" onkeyup="doSomething()">

Answer 2

请运行下面的代码段。

触发器为onkeyup，已被选择用于演示。您可以根据需要进行更改，例如，按下按钮后运行javascript函数watchWords。

function watchWords()
{
  var watch_words = ['apple', 'lemon', 'watermelon'];
  var textvalue = document.getElementById('name').value;
  for(var i=0; i<watch_words.length; i++) {
    if (~textvalue.indexOf(watch_words[i])){

      if(watch_words[i] == 'apple'){
        console.log('Apple was found');
      }
      
      if(watch_words[i] == 'lemon'){
        console.log('Lemon was found');
      }
      
      if(watch_words[i] == 'watermelon'){
        console.log('Watermelon was found');
      }
      
    }
  }
}

<input type="text" name="name" id="name" onkeyup="watchWords()" />

Answer 3

一种选择是使用由您要标识的{ "id": ["user_H_1"], "gender": ["male"], "id.1": ["user_H_1e", "user_H_2e"], "gender.1": ["female", null], "age": [null, "62"] }索引的对象，该对象的属性值是您要为每个函数运行的函数，例如：

.value

Answer 4

使用jQuery on keyup事件监听器和includes函数：

$("#custom").on("keyup", function() {
  if (this.value.includes("apple")) {
    // do something
  }
});

上面的代码将在用户每次按键时检查custom输入，并在输入字符串包含单词if的情况下执行apple块。

Answer 5

<script>
function common(arr1, arr2) {
    var newArr = [];
    newArr = arr1.filter(function(v){ return arr2.indexOf(v) >= 0;})
    newArr.concat(arr2.filter(function(v){ return newArr.indexOf(v) >= 0;}));

    return newArr;
}

var string = document.getElementById("custom").value;
var items = string.split(" ");

var yourlist = ["apple", "banana", "tomato"];

var intersection = common(yourlist, items);

for(i=0; i<intersection.length; i++){
    console.log(intersection[i]);
    var z = yourlist.indexOf(intersection[i]);
    /* Your Logic Goes Here.. */
    if(z == 0){
        /* do something */
    }else{
        /* do something else */
    }
}
</script>

功能积分-https://gist.github.com/IAmAnubhavSaini

如何检查某些单词的文本输入更改？

5 个答案: