Question

我的问题是显示与mysql结果相关联的图像...假设结果有ID = 250而Name = brand.model，那么我想要一段代码在文件夹中搜索图像服务器上的名称id_brand.model.jpg。

数据库结构是id，master，name。当用户从下拉列表中选择Brand + Model时，它应该从文件夹中获取图像（也可以从数据库中获取图像，现在哪个更好），图像都具有唯一的名称，应该作为部件名称回显。

（图片有助于理解我的意思http://imgur.com/a/7XwVd）

这里是我已编码的所有代码。 http://pastebin.com/kQF2qP64

感谢任何帮助。

Answer 1

首先，您需要绑定change的{{1}}事件，将名称发送到函数以搜索文件，然后将文件附加到DOM：

Javascript（Ajax）

select

PHP（search_images.php）

// Every time a category is selected we request the files
$('#category').on('change', function() {
    // If we have an element with images loaded, lets delete it
    var searchResult = $("#search-result").empty();
    // Now we serialize the form data, add an id to the form
    var searchBrand = $('#gender').find('option:selected').text();
    var searchModel = $('#category').find('option:selected').text();
    var fileName = searchBrand + '.' + searchModel + '.jpg';
    var searchData = { filename: fileName }
    // Now we create the ajax request with the form data
    var request = $.getJSON('search_images.php', searchData);
    // If the request success we show the images
    request.done(function(data) {
        // For each image found we add a new image to the DOM
        $.each(data, function(index, image_uri) {
            // First let's create the image element
            var img = $("<img>", {
                "class": "result-image",
                "src": image_uri
            });
            // Then we append it to the DOM
            searchResult.append( img );
        });
    });
    // If the search fails, we notify that no results were found
    request.fails(function() {
        alert('No results found');
    });
});

从数据库下拉搜索，获取不同型号/品牌的图像并显示它

1 个答案:

Javascript（Ajax）

PHP（search_images.php）