如何在数组中搜索用户输入并打印特定文本-解网

问：

我尝试编写一个网站，用户必须从数组中输入一个单词才能获得一些输出。输出应该是一个弹出窗口。

我尝试将一个将输入与数组进行比较的函数和另一个控制弹出窗口的函数结合起来。

挣扎的是弹出窗口不起作用。可能是我的一些代码在错误的地方。请看一下。

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
        <link href="styles.css" rel="stylesheet">
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundl.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
        <script src="text.js" rel="text"></script>
        <scrpit src="p2.js" rel="javascript"></scrpit>
        <title>The history of Socks</title>
    </head>
    <body>
        <header class="container">
            The history of Socks!
        </header>
            <div class="lb">Please type in a century including AC or BC!</div>
            <div class="modal">
                <div class="modal-dialog modal-content modal-header modal-body" id="print">
             </div>
            </div>
            <input type="text" id="txt">
            <button type="button" id="bu" class="btn" onclick="checktxt()"></button>
            <div>
                <ul>
                    <li> <a href="p2.js">Javascript</a></li>
                    <li> <a href="styles.css">style</a></li>
                    <li> <a href="text.js">Text</a></li>
                    <li> <a href="index.html">Main</a></li>
                </ul>
                </div>
    </body>
</html>

const array1 = ["1stcenturyBC", "2ndcenturyBC"]
const array2 = ["3rdcenturyAC", "4thcenturyAC"]

function checktxt() {
  let text;
  var input = document.getElementById("txt").value;
  var response = document.getElementById("print");
  var myModal = new bootstrap.Modal(document.querySelector('.modal'), {})
  if (array1.includes(input)) {

  response.innerHTML = Text1;
  myModal.toggle()

    return function B() {
      var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-ba-toggle="popover"]'))
      var popoverList = popoverTriggerList.map(function(popoverTriggerEl) {
        return new bootstrap.Popover(popoverTriggerEl)
      })
    }
  }else if (array2.includes(input)){

    response.innerHTML = Text2;
    myModal.toggle()

    return function B() {
      var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-ba-toggle="popover"]'))
      var popoverList = popoverTriggerList.map(function(popoverTriggerEl) {
        return new bootstrap.Popover(popoverTriggerEl)
      })
    }
  }

}

const Text1 = "In the Greeks, piloî are socks made from mattet animal hair or skin.";
const Text2 = "The Romans weared a sock- sandal combination made out of leather and fabric strips essentails. They were used to keep their feet warm during battles. The poor weared foot wraps. The wealthy were enable to got fittes socks.";

JavaScript 按钮输入弹出框

我给你做了一个片段，但必须解决以下问题：1. - 数组元素有逗号，而不是分号作为分隔符。2. 您拼错了 getElementByID。该脚本现在可以工作了。您需要单击“编辑”，并将其设置为最小可重现的示例。bootstrap 的东西不能与您到目前为止发布的内容一起使用["1", "s"]]

0赞 mplungjan 11/2/2023

console.log(array1.includes(input))不返回布尔值。你想测试if (array1.includes(input))

答：

0赞 Afzal K. 11/2/2023 #1

const array1 = ["1", "s"]

function checktxt() {
  let text;
  var input = document.getElementById("txt").value;
  var response = document.getElementById("print");
  var myModal = new bootstrap.Modal(document.querySelector('.modal'), {})
  if (array1.includes(input)) {
  
  response.innerHTML = input;
  myModal.toggle()
  
    return function B() {
      var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-ba-toggle="popover"]'))
      var popoverList = popoverTriggerList.map(function(popoverTriggerEl) {
        return new bootstrap.Popover(popoverTriggerEl)
      })
    }
  }
}

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>

<!-- Modal -->
<div class="modal">
      <div class="modal-dialog modal-content modal-header modal-body" id="print">
  </div>
</div>
<input type="text" id="txt">
<button type="button" id="bu" class="btn-primary" onclick="checktxt()">Check Text</button>

希望对你有所帮助！

如何在数组中搜索用户输入并打印特定文本

How to search in an array for the users input and print a certain text

评论

评论