Flickr Api 在使用 html 输入时不会删除馈送的照片，但在代码中手动更改时

Question

我在 JavaScript 上用 Flickr API 做了一个小应用。它 returns 特定标签的十张最近的照片。当搜索标签时，它会带来一张照片，到这里为止一切都很好。在下一次搜索时，它会保留旧照片并只添加新照片。计划 "delete" 旧照片。访问：https://jsfiddle.net/79uueuso/

var thread = null;

    function findTags(input) {
        console.log(input);

        var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
        // Get the vaules of the Flickr-API
        $.getJSON(flickerAPI, {
                    tags: input, // input = value of the input text field
                    tagmode: "all",
                    format: "json"
                })
                // get 10 pictures
                .done(function (data) {
                    $.each(data.items, function (i, item) { // put them in a <img> with thumbnail of bootstrap / append them to the <div> with id="images"
                        $("<img class='img-thumbnail'>").attr("src", item.media.m).appendTo("#images");
                        if (i === 9) {
                            return false;
                        }
                    });
                });
    }
    // Get the Value of the text input field while you type!
    // The function reads the value 500ms after your last typing (.keyup)
    $('#tag').keyup(function () {
        clearTimeout(thread);
        var $this = $(this);
        thread = setTimeout(function () {
            findTags($this.val())
        }, 750);

    });

本来是这样的，访问：https://jsfiddle.net/ckdr2Lwx/

(function() {
    var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";

        $.getJSON(flickerAPI, {
                    tags: "Schloss Heidelberg",
                    tagmode: "any",
                    format: "json"
                })
                .done(function (data) {
                    $.each(data.items, function (i, item) {
                        $("<img>").attr("src", item.media.m).appendTo("#images");
                        console.log("Hallo die " + [i] + ".");
                        if (i === 9) {
                            return false;
                        }
                    });
                });

})();

Answer 1

我解决了我的问题。我添加了一个删除输入值的功能，之后当没有输入值时，最近的照片将被删除并且搜索不会从头开始。首先，您必须在输入字段中输入一些内容。这是我使用的附加代码。

// when pressing backspace once, the whole input field gets cleared. 
        $('html').keyup(function(e){
            if(e.keyCode == 8) {
                var photo = document.getElementById("tag");
                photo.value = "";               
                var photoDel = $(".img-thumbnail");     // All pictures of the last search will be deleted. 
                photoDel.remove();
            }
        });
            if(input == ""){            // The search only works now when the input field is not empty-
                return false;
            }else {

已添加到

之上

var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
                // Get the vaules of the Flickr-API

Flickr Api 在使用 html 输入时不会删除馈送的照片，但在代码中手动更改时

Flickr Api doesn't delete feeded photos when using an html input, but when changing it manually in the code

javascript

flickr