我尝试编写一个网站，用户必须从数组中输入一个单词才能获得一些输出。输出应该是一个弹出窗口。
我尝试将一个将输入与数组进行比较的函数与另一个控制弹出窗口的函数结合起来。
问题在于弹出窗口不起作用。可能是我的某些代码位于错误的位置。请看一下。
<!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.";
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>希望有帮助！