0

我有两个 div,其中 DIV 1 默认可见,如果任何用户点击“点击我”链接,DIV 1 应该隐藏,DIV 2 应该可见,之后我不想在任何上显示 DIV 1点击。DIV 1 应该永久隐藏,直到页面刷新。

我处理了一个代码,但我无法永久隐藏 DIV 1。

请查看此代码。

<script>
function showDivs(start)
{
 var div;
 while((div = document.getElementById('div' + start)) !== false)
 {
  div.style.display = (div.style.display == 'none') ? '' : 'none';
  start ++;
 }
}
</script> 
<div class="expressBox"><div class="expressBtn"><a href="javascript:;" onclick="showDivs(1);" id="displayText">Click ME</a></div>
              <div class="txtStyle expressTxt" id="div1">Use saved addresses and payment options to expendite your purchase.</div>
              <div id="div2" style="display:none">
                <div class="existUserBox">
                  <div class="userHD"><strong>New User</strong></div>

                    <form name="ZB_ZipForm" action="$field{site_url_secure}/expresscheckout/index.html" method="post">
                    <div class="txtShipping">
                      <input type="text" size="13" maxlength="10" name="txt_zip" id="zipcode" placeholder="Zip Code" class="inputSpace" value="" />
                     <div class="clr"></div>
                      Required for Express Checkout</div>
                      <div class="btnSubmit">
                        <input type="image" name="btn_ExpressZip" src="$field{path_images}/global/btn-express-submit.png" />
                      </div>
                    </form>

                </div>
                <div class="orDivider"><span>or</span></div>
                <div class="existUserBox">
                  <form name="ZB_LoginForm" action="$field{site_url_secure}/expresscheckout/login.html" method="post">
                    <div class="userHD"><strong>Existing User</strong></div>
                    <div class="txtShipping">
                      <input type="text" name="username" size="20" id="username"  placeholder="User Name" value="" class="inputSpace userSpace" />
                    </div>
                    <div class="txtShipping">
                      <input type="password" name="password" id="password"  placeholder="Password" size="20" class="inputSpace userSpace nomargBott" />
                    </div>
                    <div class="reqExpChk"><a class="smallcolor" href="$field{site_url}/reminder/index.html" onMouseOver="status='Click for password help.'; return true;" onMouseOut="status=''; return true;">Forgot Password ?</a></div>
                    <div class="btnSubmit">
                      <input type="image" name="btn_Login" src="$field{path_images}/global/btn-express-submit.png" />
                    </div>
                  </form>
                </div>
              </div>
              </div>

我试图找到这种解决方案,但没有得到任何解决方案。请帮我。非常感谢。

4

1 回答 1

2

案例1: 如果你只处理两个div,你可以直接进行更改,而不是使用循环 document.getElementById('div1).style.display = 'none';
document.getElementById('div2).style.display = 'block';

案例 2: 如果您正在处理多个 div,您可以从文档中删除 div 元素
var div = document.getElementById('div1'); div.parentNode.removeChild(div);

案例 3: 如果您正在处理多个 div 并且您不想永久删除元素,那么 Use an array to store the id of div elements which are previously made invisible. Use the array everytime to make sure that divs in the array are not made visible again

于 2012-11-20T10:42:58.490 回答