使用ajax使用数据库中的数据刷新Div

我有这个项目，我在这里改变了幻灯片中的图像而不刷新页面。我花了4个多小时徒步搜索教程。使用ajax使用数据库中的数据刷新Div

我是新的ajax和jquery，我想要开始。

我很欣赏任何形式的帮助。谢谢:)

2011-11-29 Amson

您可以使用jQuery来设置src属性的任何img标签：

$('#imgid').attr('src','new/path/to/image.jpg');

或者，也许.load是你所需要的 - 它将对HTML文档或片段和一个AJAX请求自动将其添加到您选择的DOM元素。例如：

$('#box1').load('images/photo.html')

将该URL中的文件添加到ID为“box1”的DOM元素中。

来源

2011-11-29 19:29:49 Blazemonger

感谢你回答。 – Amson

对不起，但加载用于从html页面加载内容而不是图像，不是吗？ – Amson

@Amson没错，但没有理由不能加载只包含''标签的HTML片段。用更简单的方法更新了我的答案。 – Blazemonger

上述答案应该能解决您的查询，但是，如果您关心缓存图像，因为上述技术可能无法及时解析图像。尝试使用此

从Ajax调用接收到的数据的形式为JSON对象

data: 
{ 
    "title":"Heart of Baikal", 
    "url":"http://abc.net/4.jpg" 
}

的代码做什么快速的解释：

在充分利用数据ajax调用一个JavaScript对象被创建并推送到一个数组/列表中。
悬停功能只显示

链接在这里给出了一个样本工作model当你将鼠标悬停在目标图像（类节目此处定义）：

$.ajax({ 
    //...add other properties of the ajax call here 
    success: function(data) { 
     var preloadedImages = []; 
     $.each(data, function(index, item) { 
      var tempImage = new Image(); 
      tempImage.src = item.url; 
      preloadedImages.push(tempImage); 
     }); 
     $(".show").hover(function() { 
      //mouseover 
      $.each(preloadedImages, function(index, item) { 
       $("<img>").attr({ 
        src: item.src 
       }).appendTo("#ajax-json"); 
      }); 
     }, function() { 
      //mouse out 
      $("#ajax-json").empty(); 
     }); 

    }, 

    error: function(error) { 
     alert("there was an error"); 
    }, 
    dataType: "json" 
});

来源

2011-12-23 22:22:48 frictionlesspulley

使用ajax使用数据库中的数据刷新Div

回答

相关问题