У меня есть два div, в которых DIV 1 будет отображаться по умолчанию, и если какой-либо пользователь нажмет на ссылку «Click me», DIV 1 должен получить скрыть, а DIV 2 должен стать видимым и после этого я не хочу показывать DIV 1 при каждом нажатии. DIV 1 должен скрываться постоянно, пока страница не обновится.Скрыть один div и показать еще один div onclick
Я работал над одним кодом, но я не смог скрыть 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>
Я пробовал найти такое решение, но не получил. Пожалуйста, помогите мне. Большое спасибо.
Спасибо за ваш ответ и предложение. Если вы можете предоставить мне рабочий пример, что мне нужно, потому что я не очень хорошо разбираюсь в javascript :( –
Вы не упомянули, что описано выше, в котором вы попали. Чтобы дать вам простое решение, просто измените LINE 'div. style.display = (div.style.display == 'none')? '': 'none'; ' TO' (div.style.display == 'none')? (div.style.display = 'block '): (div.parentNode.removeChild (div)); ' – Senthilnathan
Спасибо за вашу помощь. Это работает .. :) –