个人中心
gpt4 book ai didi

javascript - YouTube 数据 API v3 搜索

转载 作者：行者123 更新时间：2023-11-28 13:35:22 24 4
gpt4 key购买 nike

我正在尝试在我的 weebly 网站上使用来自 youtube data api v3 的关键字搜索，但无法让它工作。我按照 javascript 代码示例页面上的说明进行操作。我已将“auth.js”文件和“search.js”添加到我的项目中，并将我的用户 ID 插入“auth.js”文件中。我将以下 HTML 代码插入到我的页面中，但它不起作用。代码有问题吗？我尝试将搜索按钮的“禁用”属性更改为“启用”，但仍然不起作用。如果不是代码问题，是否可能是因为它是一个 weebly 网站？任何建议或帮助将不胜感激。谢谢。 

<!doctype html>
<html>
<head>
<title>Search</title>
</head>
<body>
<div id="buttons">
  <label> <input id="query" value='cats' type="text"/><button id="search-button"    
disabled onclick="search()">Search</button></label>
</div>
<div id="search-container">
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="auth.js"></script>
<script src="search.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady">
</script>
</body>
</html>

最佳答案

这是一种方法:

<!doctype html>
<html>
  <head>
  <title>Search</title>
  </head>
  <body>
    <div id="buttons">
    <label> <input id="query" value='cats' type="text"/><button id="search-button"   onclick="keyWordsearch()">Search</button></label>    
    <div id="container">
      <h1>Search Results</h1>
      <ul id="results"></ul>
    </div>           
    <script>
     function keyWordsearch(){
        gapi.client.setApiKey('api_key_here');
        gapi.client.load('youtube', 'v3', function() {
                makeRequest();
        });
}
    function makeRequest() {
        var q = $('#query').val();
        var request = gapi.client.youtube.search.list({
                q: q,
                part: 'snippet', 
                maxResults: 10
        });
        request.execute(function(response)  {                                                                                    
                $('#results').empty()
                var srchItems = response.result.items;                      
                $.each(srchItems, function(index, item) {
                vidTitle = item.snippet.title;  
                vidThumburl =  item.snippet.thumbnails.default.url;                 
                vidThumbimg = '<pre><img id="thumb" src="'+vidThumburl+'" alt="No  Image Available." style="width:204px;height:128px"></pre>';                   

                $('#results').append('<pre>' + vidTitle + vidThumbimg +  '</pre>');                      
        })  
    })  
}
  </script> 
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  <script src="https://apis.google.com/js/client.js?onload=googleApiClientReady">  </script>
</body>
</html>

关于javascript - YouTube 数据 API v3 搜索，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21813076/

24 4 0
文章推荐： swift - @ObjectBinding 不适用于协议(protocol)
文章推荐： swift - 在以编程方式创建的标签中使用变量显示文本
文章推荐： css - 制作一个无序列表填充 2 列
文章推荐： swift - 限制 firestore 检索数据的频率
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com