为什么这个淡出不起作用？

-4

我只是将其添加到内部html文档中。所以它只想让这个特定的物品活10秒。其他人就像它一样，因为他们代表不同的聊天泡泡。为什么这个淡出不起作用？

function placeChatBubbleOnScreen(message){ 
    var chatBubble = "<div class= 'glass' onshow = '$(this).fadeOut(1000);'><p class= 'chat'>" + message + "<p></div>"; 
    //<img class = 'speechBubble' src = '../images/GibberChatBubble.png'/> 
    document.getElementById("MenuBackground").innerHTML += chatBubble; 
}

来源

2016-02-19 Travis Tubbs

请提供一个[mcve] –

你需要更多的代码。 – thatOneGuy

这是我的整个功能，它的工作原理，但onshow jquery方法不起作用 –

由于您在问题中标记了jQuery，因此我将在此处放置一些jQuery。

如您对问题的评论所示，没有定义onshow属性，这意味着它本身不会执行任何操作。您仍然可以添加一个，但它不会与任何类型的事件侦听器关联。您最好使用jQuery中的.fadeOut（），而不是试图将侦听器关联到可见的时候。

这里有一个很好的jQuery的方式来写你想做什么：

function placeChatBubbleOnScreen(message){ 
    var thisDiv = $('<div>').addClass('glass').append(
    $('<p>').addClass('chat').append(message) 
).appendTo('#MenuBackground'); 

    setTimeout(function(){thisDiv.fadeOut('slow');}, 2000); 
}

如果你不知道很多jQuery的这可能会造成混淆，所以我希望你知道的基本知识。在这里，我创建了一个新的DIV（jQuery方法[$]，当传递一个元素的开放标签时，将创建一个代表该元素的新jQuery对象），将类玻璃添加到DIV中，并添加一个段落班级聊天和传递给placeChatBubbleOnScreen方法的文本。在创建DIV之后，在附加了消息的段落中，我将DIV附加到ID为MenuBackground的元素。然后，我设置一个超时时间，以便消息在屏幕上保持2秒（2000毫秒），然后慢慢地淡出。

当然，有很多不同的方法可以做到这一点，就像编码中的大多数事情一样，但这种方式很有效，而且非常简洁。你可以在这里看到一个小提琴：https://jsfiddle.net/jy0znq0c/

来源

2016-02-19 22:29:09

ooooooooohhhhhhhhh！这很有道理！是的，我对jQuery非常陌生，帮了大忙！应该很明显，我应该只是更新了menubackground。万分感谢！ –

为什么这个淡出不起作用？

回答

相关问题