如何显示和隐藏div使用两个不同的链接

我有HTML页面，我将链接为“SHOW”，同时点击，我需要显示div区域。其中DIV拥有iframe。如何显示和隐藏div使用两个不同的链接

正常情况下，当加载HTML页面时，div应该处于隐藏状态，而只需点击它即可显示。

我需要关闭按钮里面的链接..虽然点击，我需要关闭隐藏的潜水。

<a href="#" onClick="toggleDisplay('toHide')">a</a> 
function toggleDisplay(id) 
    { 
     if (!document.getElementById) { return; } 
     var el = document.getElementById('straddle'); 
     if (el.style.display == ''){ 
      el.style.display = 'none'; 
     }else { 
      el.style.display = ''; 
     } 
    }

我不希望这种切换功能

请帮助我。

来源

2013-11-21 user3007361

'如果（！document.getEl ementById）'似乎是错的 – Praveen

1）if（！document.getElementById）你在找哪个ID？ 2）什么显示：''??如果我知道的正确，如果你想让你的div可见，你可以将它设置为显示：block/inline/inline-block。 3）你想在div内关闭按钮？ – Pratik

但我需要两个不同的链接，以显示和隐藏..在HTML页面显示按钮隐藏按钮内部DIV – user3007361

您的JavaScript

<script type="text/javascript"> 
<!-- 
    var whatever = document.getElementById('mydiv'); 
    whatever.style.display = 'none'; 

    function show(){ 
      whatever.style.display = 'block'; 
    } 

    function hide(){ 
      whatever.style.display = 'none'; 
     } 
//--> 
</script>

然后将HTML

<a href="#" onclick="show();">Click here to show element </a> 
<br/> 
<div id="mydiv"> 
This will disappear and reappear and 
<a href="#" onclick="hide();">Click here remove element</a></div>`

来源

2013-11-21 04:30:09 Roukas

但我需要两个不同的链接显示和隐藏.. 显示按钮，在HTML页面隐藏按钮内部DIV – user3007361

@ user3007361刚刚编辑它为你，现在应该工作，因为你想它 – Roukas

使用jQuery：

$(document).ready(function() { 
    $('#link1').click(function() { $('#div').css({ display:'none' }) }) 
    $('#link2').click(function() { $('#div').css({ display:'block' }) }) 
})

来源

2013-11-21 04:38:51

你可能想this（Iframe可能需要一段时间来加载，所以让我们负载）

HTML：

<a href="#" id="show">Show</a> 
<div id="straddle"> 
    <div id="close">Close</div> 
    <iframe width='100%' src="http://heera.it"></iframe> 
</div>

JS：（closong <scripe type="text/javascript"></scripe>之间</body>标记之前把它）

window.onload = function() { 
    var show = document.getElementById('show'), 
     el = document.getElementById('straddle'), 
     close = document.getElementById('close'); 
    show.onclick = function() { 
     el.style.display = 'block'; 
     return false; 
    }; 
    close.onclick = function(){ 
     el.style.display = 'none'; 
    }; 
};

更新：新增相关css

#straddle{ display:none; } 
#close{ 
    float:right; 
    cursor:pointer; 
    display:inline-block; 
}

来源

2013-11-21 04:48:47

Hi.1时间，同时打开HTML页面..DIV应该隐藏.. onlu = y点击显示我需要显示Div – user3007361

@ user3007361，是的，它是隐藏的第一次检查[demo here]（http://jsfiddle.net/QmJT5/2/），添加'css'。 –

谢谢..在我的HTML页面中，我将显示一些数据..一旦点击我的div应该在数据上面..内部HTML – user3007361

如何显示和隐藏div使用两个不同的链接

回答

相关问题