gpt4 book ai didi

javascript - 通过单击链接将元素隐藏后重新出现(需要不包括 return false 或 preventDefault 的解决方案)

转载 作者:行者123 更新时间:2023-11-28 06:12:13 26 4
gpt4 key购买 nike

我有一个元素(DIV,里面有一个链接)我需要通过点击链接来隐藏,点击该链接后要显示一个表单,问题是链接的 div 很快就会重新出现隐藏后,如果我使用 return falsepreventDefault,它会工作,但它会阻止将 href 值添加到 url,我确实需要添加它。

这是代码

<body>
<div id="categContainer1">
<div class="titimmo"><a href="ajoutertest.php?c=realestate" id="a_categ">Real Estate</a></div>
</div>

<div id="formContainer" class="hidden">
<form action="ajouter.php" method="post">

<h4>Category:</h4>

<h4>Made :</h4>
<input type="text" name="made" />
<h4>Model :</h4>
<input type="text" name="modele" /><br /><br />

</form>
</div>
</body>


<script type="text/javascript">
function stepone(){
document.getElementById('a_categ').onclick = function () {
document.getElementById('categContainer1').className += " hidden";

document.getElementById('formContainer').className = "visible";

};
}
stepone();
</script>

<style type="text/css">
.titimmo {
text-align:center;
padding:10px;
font-size:14pt;
background-color:#CC3300;
display:block;
}
.hidden {
display:none;
}
.visible {
display:block;
}
#formContainer {
padding: 1em 0 1em 2em; background-color:#E8E8E8; margin: 1em 0 1em 2em; width:88.9%;
}
#formContainer h4{
color:#FF3300;
}
</style>

这是 Fiddle

如果可以以其他方式完成,将不胜感激,我只需要在 URL 中添加 href 值即可。

最佳答案

你必须使用 Javascript 的历史操作函数。

function stepone(){
document.getElementById('a_categ').onclick = function () {
document.getElementById('categContainer1').className += " hidden";

document.getElementById('formContainer').className = "visible";
window.history.pushState('Form', 'My form', this.getAttribute("href"));
return false

};
}

stepone();

关于javascript - 通过单击链接将元素隐藏后重新出现(需要不包括 return false 或 preventDefault 的解决方案),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36100632/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com