Question

我有这个jQuery代码。它的作用是当你单击一个div按钮（#logogo）时，它会在舞台上显示一个调整大小的图像。

$(document).ready(function(){
    $("#logogo").click(function(){
        $(this).addClass("active");
        $("#bannergo").removeClass("active");
        $("#innerstage").html("<img id=\"magiclogogo\" src=\""+document.getElementById("logogo").title+"\">").hide().fadeIn('fast');
    });
});

接下来我要发生的是当你点击图像（因此是magiclogogo id）时，它将能够以原始大小显示（或加载）图像。

到目前为止，我尝试使用id并试图为它创建一个jquery函数，但它不起作用。

如果无法实现，是否有可能将图像缩放到原始尺寸？

Answer 1

$(document).on("click", "#magiclogogo", function(){

    // your code here
});

Answer 2

所以，我猜测的是，在其他地方，你有类似的东西：

$('#magiclogogo').on('click', function() {
   //More code here...
}

如果dom元素尚未加载，则它不会正确附加事件。换句话说，一旦加载DOM元素就必须附加事件，或者将事件附加到父元素并查找事件的来源（jquery有一个简写，这是另一个答案）。

您可以使用jQuery构造函数创建元素，然后附加事件。

var image = $("<img id=\"magiclogogo\" src=\""+document.getElementById("logogo").title+"\">");

image.on('click', function(){
  //Your code here
});

然后，您可以使用append将其添加到容器中。

 $('#innerstage').append(image);

在Javascript字符串中调用ID和类

2 个答案: