Question

对于迟到以及不发布代码的邋。感到抱歉。

所以这里有效：在索引页面中，有一些类别，用户可以使用这些类别在显示的图像之间进行过滤。当用户过滤图像时，我获取图像并通过jQuery AJAX将它们传递给我的控制器，在那里我获得了新的过滤图像。这是AJAX方法的样子：在“filter_these”变量中，存储变量。

$.ajax({

     'type': 'post',
     'url': '*controllername*',
     'datatype': 'html',
     'data': {'categories': filter_these}, 
     success: function(response){
         window.alert(response);
     }
});

在我的控制器中，我获得了存储在变量中的新图像。在jQuery中传递时，图像处于“响应”变量中。现在我需要找到一种方法来重新加载页面的图像部分，使用新图像。如果我不必在其周围应用大量HTML内容，这可以很容易地完成。

所以我想知道的是如何使用新图像重新加载页面的那一部分。

我正在考虑回复一个带有这些图片的页面，但在使用Codeiginiter时我似乎无法找到它。

或者在我的控制器中回应它，这不是一种好的工作方式。帮助会很感激。

Answer 1

将（load_image.php）加载到某个div中的Jquery函数。

$('#filter_id').click( function(){
                    // grabs some info so we know what the image is
        var aa = $('#image').val();
                    // clears the div before loading
            $('#div_id').empty();   
                    // loads the php page into the div                          
        $('#div_id').load('load_image.php?imagename='+aa);      

        });

load_image.php

   <php    
       $imagename = $_GET['imagename'];
    ?>

     <img src="/images/<?php echo $imagename;?>">

Answer 2

你可以这样做：

<div id="imagesContainer">
    <img src="image1.jpg" title="Fred" />
    <img src="image2.jpg" title="Dave" />
</div>

使用jQuery显示/隐藏图像，使用id为“filter”（<input type="text" id="filter" />）的文本输入框。这将使用images的title属性中的文本作为过滤的内容：

$('input#filter').keyup(function() {
    if($(this).val() == '') { //If the filter is blank
        $('div#imagesContainer > img').show(); //Show all the images
    } else { //If the filter is not blank
        $('div#imagesContainer > img').hide(); //Hide all of the images to start with
        $('div#imagesContainer > img[title^="'+$(this).val()+'"]').show(); //Show the matching images
    }
});

查看此JSFiddle：http://jsfiddle.net/59ngx/（在此示例中，您可以搜索Mario，Zelda或Sonic）

通过jQuery刷新DIV和很多html

2 个答案: