从提示中获取用户输入，搜索图像数组并显示用户找到的图像 [javaScript]]

Question

本质上，我正在尝试使用提示中的用户输入来搜索数组，并根据用户搜索显示图像。

目前我一直在尝试这个方法，我确信它是正确的，虽然我不确定它是否是诚实的。

我的 html 看起来像这样：

        <label>Specific slide</label>
        <button id="submit" onclick="specificSLIDE()">enter a specific slide</button>

我的 javascript 与按钮交互看起来像这样（很乱）：

function specificSLIDE(){

var ImageSearch = prompt("Enter a specific slide you would like to view", "<slide goes here>");
var ARRAYSEARCH = "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide"+ImageSearch+".jpg";
if(ImageSearch!= null){
//        document.getElementById("slide").innerHTML = imageArray.find(ImageSearch);
   // document.getElementById("slide").innerHTML = imageArray.find(ARRAYSEARCH);
    document.getElementById("slide").innerHTML = '<img src='+imageArray(ARRAYSEARCH)+'id="slide">';
    console.log(ImageSearch);
}else{
    prompt("PLEASE ENTER A VALUE");
}
}

结果应输出到此 html 元素：

imgStart[0].innerHTML = '<img  src="../Clientside/Sampledata/Single Page Architecture (SPA)/Slide1.jpg" id = "slide">';

我的数组：

var c = 0,imageArray = ["../Clientside/Sampledata/Single Page Architecture (SPA)/Slide1.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide2.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide3.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide4.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide5.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide6.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide7.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide8.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide9.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide10.jpg", "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide11.jpg"];

我知道这可能是一种非常低效的搜索数组的方法，但它是我能够想出的更好的解决方案之一，尽管它不太管用。

如有任何帮助，我们将不胜感激。

Answer 1

正如我在评论中所写：
好的，为了获得数组项的值，您可以像这样调用它 [indexofElementinArray]。在您的示例中，您已经有了值 ARRAYSEARCH，因此您只需检查它是否存在于数组中。所以：

function specificSLIDE(){

var ImageSearch = prompt("Enter a specific slide you would like to view", "<slide goes here>");
var ARRAYSEARCH = "../Clientside/Sampledata/Single Page Architecture (SPA)/Slide"+ImageSearch+".jpg";
if(ImageSearch && imageArray.indexOf(ARRAYSEARCH)!== -1){
//        document.getElementById("slide").innerHTML = imageArray.find(ImageSearch);
   // document.getElementById("slide").innerHTML = imageArray.find(ARRAYSEARCH);
    document.getElementById("slide").innerHTML = '<img src='+ARRAYSEARCH+'id="slide">';
    console.log(ImageSearch);
}else{
    prompt("PLEASE ENTER A VALUE");
}
}

从提示中获取用户输入，搜索图像数组并显示用户找到的图像 [javaScript]]

Taking user input from a prompt, searching an array of images and displaying the image the user has found [javaScript]]

html

javascript

arrays

prompt