任何人都可以帮助我使搜索栏正常工作，因为我现在有 JS 提示吗？

Question

我创建了一个从 YouTube API 中提取的小程序，它允许您在出现提示时根据您输入的任何标题搜索随机视频。我的目标是让这项工作像搜索引擎一样。我想让我的搜索栏成为输入而不是警报提示 window。同样，当您运行中带有 javascript 的程序时，我还想让 "Find" 按钮充当提示警报 window 上的 "Ok" 按钮jsbin。有人能指出我正确的方向来完成这个吗？ Here is the jsbin。我假设我可以只对按钮使用某种 OnClick 函数，但不完全确定如何实现它以及我将调用它的内容。谢谢！

PS。我确定您已经知道这一点，但以防万一...确保您运行 jsbin 中的程序与 "Run with JS."

Answer 1

您可以只向查找按钮添加一个 onclick 侦听器，并在有人单击时触发代码。可以得到搜索的值input而不是提示：

Javascript:

function search()
{
    var api_key; 
    api_key = "AIzaSyDiUEkwoldcB9qgRreOsaiyu2Nlj8U-03c";

    var search_term = document.getElementById("searchterm").value;

    function onSuccess(data){
        console.log(data);
        var obj = data.id;
        console.log (data.items[0].id.videoId);

        video_url = 'http://www.youtube.com/embed/' + data.items[0].id.videoId     +'?autoplay=1'; 
        video.src = video_url;
    }

    var youtube_url = 'https://www.googleapis.com/youtube/v3/search?part=id&q=' +search_term +'&maxResults=1&key=' +api_key;

    var video_url = 'http://www.youtube.com/embed/' +"IQ1_acLEVVo"+'?autoplay=1'; 


    $.ajax({
      method:'GET',
      url: youtube_url,
      success: onSuccess
    });

}

HTML:

<button type="button" id="search" onclick="search()">Find</button>

jsbin

任何人都可以帮助我使搜索栏正常工作，因为我现在有 JS 提示吗？

Can anyone help me make the search bar work as I now have the JS prompt?

javascript

html

search

youtube-api

search-engine