Javascript 预览图像Jquery脚本don'；t运行良好

我使用的Jquery脚本在鼠标悬停时执行预览图像，但我的问题是该脚本只在前两个图像中运行

要访问我实现的web：

我认为问题是因为我正在打印来自de jquery脚本的html代码，因为我在jquery中使用Ajax和Json

这是打印html代码的Jquery：

(function($) { 
    $(document).ready(function(){

        id=$("#colecciochange option:first").val()
        getcoleccions(id);
            //getpuntosdeventa(1);
                $("#colecciochange").change(function(){

                 getcoleccions($(this).val())

            });
            function getcoleccions(id)
            {
            $("ul.appends").empty()
            $("div.descripcio").empty()


                    $.getJSON('<?php echo url_for('ajax/coleccio/?id=',true)?>'+id, function(data) {



                          $.each(data.items, function(key,val) {

                                //items.push('<p>' + val.nombre + ','+val.direccion + ','+val.ciutad +'</p>');
                                //$("ul.appends").append('<li><a href=' +val.foto_g + ' class="preview" title><img src='+val.foto_th +' alt="prova" /></a></li>');
                                $("#galeria").append('<li><a href="/1.jpg" id="1" class="preview"><img src="/1s.jpg" alt="gallery thumbnail" /></a></li>');

                          });
                          $("div.descripcio").append('<p>' +data.nom_coleccio + '</p>');

                }); 
            }
        });
 })(jQuery)

（函数（$）{
$（文档）.ready（函数（）{
id=$（“#colecciochange选项：first”）.val（）
获取证书（id）；
//getpuntosdeventa（1）；
$（“#colecciochange”）.change（函数（）{
getcolaccions（$（this.val（））
});
函数getcolaccions（id）
{
$（“ul.appends”）.empty（）
$（“div.descripio”）.empty（）
$.getJSON（“”+id，函数（数据）{
$.each（数据项、函数（键、值）{
//items.push（“”+val.nombre+”、“+val.direcion+”、“+val.ciutad+”
”）；
//$（“ul.appends”）.append（“
”）；
$（“#galeria”）。追加（“
”）；
});
$（“div.descripio”）.append（“”+data.nom_coleccio+”
）；
}); 
}
});
})（jQuery）

这是进行图像预览的脚本：

this.imagePreview = function(){ 
    /* CONFIG */

        xOffset = 10;
        yOffset = 30;

        // these 2 variable determine popup's distance from the cursor
        // you might want to adjust to get the right result

    /* END CONFIG */
  console.log($(this).attr("id"));
    $("a.preview").hover(function(e){
        console.log($(this).attr("id"));

        this.t = this.title;
        this.title = "";    
        var c = (this.t != "") ? "<br/>" + this.t : "";
        $("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");                                var id=($(this).attr("id"));



        $("#preview")
            .css("top",400 + "px")
            .css("left",150 + "px")
            .fadeIn("fast");                    
   },
    function(){
        this.title = this.t;    
        $("#preview").remove();
   });  
    /*$("a.preview").mousemove(function(e){
   console.log($(this).attr("id"));
        $("#preview")
            .css("top",400 + "px")
            .css("left",150 + "px")

    });*/
   $("a.preview").click(function(event) {
 event.preventDefault();
 //

});         
};
$(document).ready(function(){
    imagePreview();
});

this.imagePreview=function（）{
/*配置*/
xOffset=10；
yOffset=30；
//这两个变量确定弹出窗口与光标的距离
//您可能需要调整以获得正确的结果
/*结束配置*/
log（$（this.attr（“id”））；
$（“a.preview”）.hover（函数（e）{
log（$（this.attr（“id”））；
this.t=this.title；
this.title=“”；
var c=（this.t！=”）？“
”+this.t:”；
$（“body”）.append（
“+c+”
”）；var id=（$（this.attr（“id”））；
$（“预览”）
.css（“顶部”，400+“px”）
.css（“左”，150+“像素”）
.fadeIn（“快速”）；
},
函数（）{
this.title=this.t；
$（“#预览”）.remove（）；
});  
/*$（“a.preview”）.mousemove（函数（e）{
log（$（this.attr（“id”））；
$（“预览”）
.css（“顶部”，400+“px”）
.css（“左”，150+“像素”）
});*/
$（“a.preview”）。单击（函数（事件）{
event.preventDefault（）；
//
});         
};
$（文档）.ready（函数（）{
图像预览（）；
});

什么时候出问题了

谢谢

关于两件事：

• $（“a.preview”）.hover（函数（e）{…}，函数（e）{…}）

  将在文档准备就绪时影响DOM中的元素，而不是随后使用JavaScript添加到DOM中的元素。在（“mouseenter”、“a.preview”、函数（e）{…}和

  $（“#galeria”）.上使用
  $（“#galeria”）。而在（“mouseleave”、“a.preview”上使用函数（e）{…}

• 您有相同id的HTML元素-id在整个HTML页面中应该是唯一的。这可能会导致问题，特别是在IE中

---

这是因为在将元素插入页面之前，imagePreview函数正在运行，因此它们没有正确绑定。请将imagePreview（）插入$.getJSON回调函数，紧靠此行下方：

$("div.descripcio").append('<p>' +data.nom_coleccio + '</p>');

$（“div.descripcio”）.append（“”+data.nom_coleccio+”
”）；

为什么你不能发布相关代码和HTML，而不是让人们转到其他网站？对不起，我如何编辑帖子？