简体   繁体   English

在JavaScript中隐藏'div'标记

[英]Hide 'div' tag in JavaScript

I have JavaScript code that hides a tag when it is clicked: 我有JavaScript代码,点击它时会隐藏标记:

document.getElementById("div").style.visibility="hidden";

Although when I do this, even though the div tag is hidden, there is still a space where the div tag is located. 虽然当我这样做时,即使div标签被隐藏,但仍然存在div标签所在的空间。 how do I collapse the whole div tag using JavaScript? 如何使用JavaScript折叠整个div标签?

采用:

document.getElementById("div").style.display = 'none';

You should use: 你应该使用:

document.getElementById("div").style.display = "none";

Just to mention that getElementById() will be looking for a div with the id of div , I suggest you change this to something more obvious, an example would be: 只是提及getElementById()将寻找一个div用的ID div ,我建议你换这个东西比较明显的,一个例子是:

<div id="container"><!--Content--></div>

Then your JavaScript could be: 然后你的JavaScript可能是:

document.getElementById("container").style.display = "none";  

Check here to see what the difference is between display:none and visibility:hidden 点击此处查看display:nonevisibility:hidden之间的区别

尝试这个 ..

 document.getelementById("div_id").style.display = 'none';
document.getElementById("yourdivID").style.display = 'none';

Use 采用

document.getElementById("divID").style.display = "none";

OR 要么

document.getElementsByTagName("div").style.display = "none";

NOTE: document.getElementById() only select the elements having id attributes. 注意: document.getElementById()仅选择具有id属性的元素。

显示/隐藏<div>标签不工作</div><div id="text_translate"><p>我有一个超链接,它应该在 onclick 事件期间一一调用 3 个 JS 函数。</p><pre> &lt;form name = "bulkcontactfrm" method="POST" action="&lt;%= servletPath %&gt;&gt; &lt;div id="saveDiv" layoutAlign="top" style="display:block;"&gt; &lt;table id="" align="left" border="0" cellpadding="0" cellspacing="0"&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="javascript:void(0);" onclick="isAllowedToResubscribe(document.bulkcontactfrm); manipulateDIV(document.bulkcontactfrm); resubscribeCall(document.bulkcontactfrm);"&gt;&amp;#160;Re-Subscribe&lt;/zoniac:roundrect&gt;&amp;#160;&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;div id="loadingDiv" class="cellWhiteBGFont" layoutAlign="top" style="display: block;"&gt;&lt;p&gt;&lt;img src="&lt;%=ImageMappingManager.getImageName("imgLoading")%&gt;" name = "b1"&gt;&amp;nbsp;&amp;nbsp;&lt;font size='3'&gt;&lt;b&gt;Please wait...&lt;b&gt;&lt;/font&gt;&lt;/p&gt; &lt;/div&gt; &lt;/form&gt;</pre><p> JS函数如下:</p><pre> // First function validate the data using ajax call function isAllowedToResubscribe(form) { //Client validation takes here processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailValidationDetails',emilIDStr,sourcefromStr); } // Second function hide the content in UI and show the Processing image in &lt;DIV&gt; tag function manipulateDIV(form) { hideSaveDiv(); showLoadingDiv(); } function hideSaveDiv() { //hide the Re-Subscribe hyperlink document.getElementById('saveDiv').style.display='none'; } function showLoadingDiv() { //show the Processing image document.getElementById('loadingDiv').style.display='block'; } // Third function is for form submit using ajax call function resubscribeCall(form) { //processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailDetails',emilIDStr,sourcefromStr); }</pre><p> 单击超链接验证 function 调用并获取成功后,出现构造消息,单击构造上的确定。 但是&lt;DIV&gt;标签并没有被隐藏,所以没有加载进度图像。</p></div> - show/hide the <div> tag is not working

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 显示/隐藏div标签javascript - Show/Hide div tag javascript 如果文本为0,则JavaScript隐藏DIV标记 - JavaScript hide DIV tag if text is 0 如何使用带有 If 条件的 javascript 隐藏 div 标签 - how to hide div tag using javascript with an If condition 在嵌入标签上隐藏div - Hide a div on embed tag 在锚标记的文本更改上显示/隐藏带有 JavaScript 的 div - On text change of anchor tag show/hide a div with JavaScript 如何使用JavaScript在ul标签内隐藏div标签 - how to hide div tags inside ul tag using javascript Javascript:无法隐藏整个html行(div标签) - Javascript: Unable to hide entire html row (div tag) 在页面加载时隐藏div标签 - Hide div tag on page load 显示/隐藏<div>标签不工作</div><div id="text_translate"><p>我有一个超链接,它应该在 onclick 事件期间一一调用 3 个 JS 函数。</p><pre> &lt;form name = "bulkcontactfrm" method="POST" action="&lt;%= servletPath %&gt;&gt; &lt;div id="saveDiv" layoutAlign="top" style="display:block;"&gt; &lt;table id="" align="left" border="0" cellpadding="0" cellspacing="0"&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="javascript:void(0);" onclick="isAllowedToResubscribe(document.bulkcontactfrm); manipulateDIV(document.bulkcontactfrm); resubscribeCall(document.bulkcontactfrm);"&gt;&amp;#160;Re-Subscribe&lt;/zoniac:roundrect&gt;&amp;#160;&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;div id="loadingDiv" class="cellWhiteBGFont" layoutAlign="top" style="display: block;"&gt;&lt;p&gt;&lt;img src="&lt;%=ImageMappingManager.getImageName("imgLoading")%&gt;" name = "b1"&gt;&amp;nbsp;&amp;nbsp;&lt;font size='3'&gt;&lt;b&gt;Please wait...&lt;b&gt;&lt;/font&gt;&lt;/p&gt; &lt;/div&gt; &lt;/form&gt;</pre><p> JS函数如下:</p><pre> // First function validate the data using ajax call function isAllowedToResubscribe(form) { //Client validation takes here processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailValidationDetails',emilIDStr,sourcefromStr); } // Second function hide the content in UI and show the Processing image in &lt;DIV&gt; tag function manipulateDIV(form) { hideSaveDiv(); showLoadingDiv(); } function hideSaveDiv() { //hide the Re-Subscribe hyperlink document.getElementById('saveDiv').style.display='none'; } function showLoadingDiv() { //show the Processing image document.getElementById('loadingDiv').style.display='block'; } // Third function is for form submit using ajax call function resubscribeCall(form) { //processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailDetails',emilIDStr,sourcefromStr); }</pre><p> 单击超链接验证 function 调用并获取成功后,出现构造消息,单击构造上的确定。 但是&lt;DIV&gt;标签并没有被隐藏,所以没有加载进度图像。</p></div> - show/hide the <div> tag is not working 在 HTML 中隐藏和显示 Div 标签 - Hide and Show Div tag in HTML
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM