单击按钮后加载内部div

我有一个隐形div display: none。单击按钮后加载内部div

我需要加载div后点击按钮，而不是OnPageLoad。

注意：

我说以后LOAD格点击按钮，我不是在谈论SHOW格。

我不想在加载页面时加载div。

HTML是在这里：

<input id="btn" type="button" value="Load Div" /> 
<div class="content" style="display: none;"> 
    <img src="http://www.kippaxvet.com.au/Portals/kippaxvet/cute%20pup.jpg" /> 
</div>

我怎样才能做到这一点？

任何想法，将不胜感激。

编辑 {更多信息}：

我有很多元素和图像中有一个div。

如果我加载onPageLoad这个div它非常沉重，需要很长时间。

我只需要加载 div当用户想要显示它。

来源

2013-07-01 Hamed Kamrava

你可以考虑创建JavaScript的一个div，并补充说，到DOM。 'document.createElement（'div'）' –

@RickHoving'img'和div内的所有内容呢？ –

我没有看到你想添加一个元素而不是仅仅显示它的用例。你能解释一下为什么你选择用这种方法来解决问题吗？ – Undefined

试试这个：

<input id="btn" type="button" value="Load Div" onclick="load()"/> 

function load() 
{ 
    var imgDiv = document.createElement('div'); 
    $(imgDiv).addClass('content'); 
    $(imgDiv).append('<img id="dynamicImg" src="http://www.kippaxvet.com.au/Portals/kippaxvet/cute%20pup.jpg" />') 
    // add the imgDiv to your parent container element. 
    // for e.g. $("#container").append(imgDiv) 
}

的jsfiddle：http://jsfiddle.net/vendettamit/QB8Hv/

来源

2013-07-01 11:17:34 vendettamit

单击按钮后加载内部div

回答

相关问题