如何使用 jQuery toggle() 和隐藏切换链接或按钮？

Question

我正在使用 PHP 会话在页面上提供特定表单，并且需要在“显示表单”链接和表单之间切换。我使用 jQuery toggle() 进行了这项工作，但我无法弄清楚如何防止“显示表单”链接在两种切换状态下都显示。

我在 toggle() 之后尝试了 jQuery hide()，但这使所有内容都消失了，我尝试使用 CSS 可见性：隐藏（这也导致包括 PHP 内容在内的所有内容都消失了）。

<div id="togLink">

<?php echo $JQclick; ?>

</div>

<div id="showForm">

<?php require_once $_SERVER["DOCUMENT_ROOT"] . '/formInc.php'; ?>

</div>

<script>

function toggleForm() {

  $("#showForm").toggle();

  $("#togLink").toggle();

}

$("#togLink").click(function() {

  toggleForm();

});

$("#showForm").click(function() {

  toggleForm();

});

</script>

上面的代码有效，但 PHP 输出显示在两种切换状态（我知道，这是预期的行为）。正如我上面所说的，我需要某种方式使切换状态“要么是要么”——可点击的链接或表单，而不是两者。任何人都可以为此提供任何建议吗？

Answer 1

将 PHP 放在 HTML 元素中可以让您单独控制该元素：<div id="togLink">foo<?php echo $JQclick; ?></div><div id="showForm">bar<span>glorp<?php require_once $_SERVER["DOCUMENT_ROOT"] . '/formInc.php'; ?></span></div>使用 CSS 隐藏元素：span {&nbsp; display: none;}然后避免要切换的元素，使用.not()：$('#togLink').click(function(){&nbsp; console.log('click');&nbsp; $('#showForm').not('span').toggle();});