【问题标题】:Cannot read property "search" of undefined无法读取未定义的属性“搜索”
【发布时间】:2014-01-04 01:58:49
【问题描述】:

我正在尝试制作一个使用 Youtube API 的脚本,我输入了一个关键字,youtube api 找到视频 -> 脚本获取第一个结果并返回 VideoID。现在我的问题是当我按下提交按钮时搜索功能没有被触发。有谁知道这可能是什么原因?这是代码;

html

<script src="assets/js/search.js" type="text/javascript"></script>
<script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script>
<body>
    <center>
    <h3 class="h3">KJKerstborrel - Muziekrequest</h3>
        <div class="input">
            <form name="muziek" action="succes/index" method="post">
                <input type="text" class="input-xlarge" id="artiest"  name="artiest" placeholder="Gewenste artiest" /><br>
                <input type="text" class="input-xlarge" id="nummer"  name="nummer" placeholder="Gewenst nummer" required/><br>
                <button style="width: 200px;" class="btn btn-success" onClick="search()" type="button">Deze wil ik horen!</button><br>
            </form>
        </div>
    </center>
</body>

JS

    // Your use of the YouTube API must comply with the Terms of Service:
// https://developers.google.com/youtube/terms
var YT = 'undefined';

// Helper function to display JavaScript value on HTML page.
function showResponse(response) {
    YT = response;

    document.getElementById('VideoURL').value = YT.items[0].Id.VideoID;
}

// Called automatically when JavaScript client library is loaded.
function onClientLoad() {
    gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
    search();
}

// Called automatically when YouTube API interface is loaded (see line 9).
function onYouTubeApiLoad() {
    // This API key is intended for use only in this lesson.
    // See http://goo.gl/PdPA1 to get a key for your own applications.
    gapi.client.setApiKey('AIzaSyD49-XZ2JV7Rws3KDM2T7nA56Jbi-O7djY');
}

function search() {
    // Use the JavaScript client library to create a search.list() API call.
    var request = gapi.client.youtube.search.list({
        part: 'id',
        q: document.getElementById("artiest").value + " - " + document.getElementById("nummer").value,
    });

    // Send the request to the API server,
    // and invoke onSearchRepsonse() with the response.
    request.execute(onSearchResponse);
}

// Called automatically with the response of the YouTube API request.
function onSearchResponse(response) {
    showResponse(response);
}

【问题讨论】:

    标签: javascript html youtube-api


    【解决方案1】:

    我在 JS 中做了一些更改,并在 html 中添加了一个字段来显示视频 ID。

    html文件:

    <script src="search.js" type="text/javascript"></script>
    <script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script>
    <body>
        <center>
        <h3 class="h3">KJKerstborrel - Muziekrequest</h3>
            <div class="input">
                <form name="muziek" action="succes/index" method="post">
                    <input type="text" class="input-xlarge" id="artiest"  name="artiest" placeholder="Gewenste artiest" /><br>
                    <input type="text" class="input-xlarge" id="nummer"  name="nummer" placeholder="Gewenst nummer" required/><br>
                    <button style="width: 200px;" class="btn btn-success" onClick="search()" type="button">Deze wil ik horen!</button><br>
                    <input type="text" class="input-xlarge" id="VideoURL"  name="VideoURL" placeholder="VideoURL"/><br>
                </form>
            </div>
        </center>
    </body>
    

    JS文件:

    // Your use of the YouTube API must comply with the Terms of Service:
    // https://developers.google.com/youtube/terms
    var YT = 'undefined';
    
    // Helper function to display JavaScript value on HTML page.
    function showResponse(response) {
        YT = response;
        // changed: namegiving
        document.getElementById('VideoURL').value = YT.items[0].id.videoId;
    }
    
    // Called automatically when JavaScript client library is loaded.
    function onClientLoad() {
        gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
        //search();    // changed.
    }
    
    // Called automatically when YouTube API interface is loaded (see line 9).
    function onYouTubeApiLoad() {
        // This API key is intended for use only in this lesson.
        // See http://goo.gl/PdPA1 to get a key for your own applications.
        gapi.client.setApiKey('AIzaSyD49-XZ2JV7Rws3KDM2T7nA56Jbi-O7djY');
    }
    
    function search() {
        // Use the JavaScript client library to create a search.list() API call.
        var qVar = document.getElementById("artiest").value
                 + " - "
                 + document.getElementById("nummer").value;
        // changed. added: type
        var request = gapi.client.youtube.search.list({
            type: 'video',
            part: 'id',
            q: qVar
        });
    
        // Send the request to the API server,
        // and invoke onSearchRepsonse() with the response.
        request.execute(onSearchResponse);
    }
    
    // Called automatically with the response of the YouTube API request.
    function onSearchResponse(response) {
        showResponse(response);
    }
    

    【讨论】:

      【解决方案2】:

      我按照您的示例进行操作,但遇到了同样的错误,但随后按照本教程进行操作,我能够成功拨打电话

      https://developers.google.com/api-client-library/javascript/samples/samples

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-05-24
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多