Question

我制作了一个缩略图，当我将鼠标悬停在它上面时，一个对话框淡入。但是，我如何编写一个通用函数，以便jQuery识别缩略图（我认为是div类或id）和对话框框显示自己的相应文本，而不是逐个为每个缩略图及其自己的文本创建一个对话框？

编辑：这是我到目前为止的代码：

$('.thumb').mouseenter( function(){
$('.descriptionBox').fadeIn('slow');});

这只是一个缩略图。我知道我可以在描述框中放置一个文本，但我想知道jQuery可以采用#id来识别DIV中的拇指并显示自己的文字

。我不知道是否与此功能有关，如果有，我怎么能从中得到：

$('.thumb').each(function(index));

Answer 1

我希望我能正确理解你的问题，这有助于显示一些代码。

如果您希望自己的功能识别出有活动的缩略图，可以使用$（this）。

例如：

$(".someClass").mouseOver(function(){
   $(this).find("dialogBox").fadeIn();
});

Answer 2

如果你问如何使用jQuery的最基本功能，那么听起来你有很高的爬坡能力。基本上，您将事件附加到非动态父级，并为要捕获的动态内容添加选择器。这是一个快速示例，它将事件附加到缩略图容器，过滤缩略图元素，并相应地修改另一个元素。

$("#thumbnailContainer").on("mouseover", ".thumbnailElement", function() {
  $this=$(this);
  $("#dialogContainer")
     .find(".dialogTextElement")
         .text($this.text())
         .end()
     .show()
     .myAddOnThatHidesTheDialogLater()
  ;
});

制作一个标识div的通用jQuery函数然后做一些事情

2 个答案: