我有2個窗體。我希望點擊按鈕在第一個表單位置顯示另一個表單。所以只是爲了替換這種形式。用另一個表單替換窗體上的按鈕單擊
表1
<div id="right">
<form id="contact" class="visible" action="" method="post">
<fieldset>
<input name="fname" placeholder="Ime" type="text" tabindex="1" required>
</fieldset>
<fieldset>
<input name="lname" placeholder="Prezime" type="text" tabindex="2" required>
</fieldset>
<fieldset>
<input name="tel" placeholder="Telefon" type="text" tabindex="2" required>
</fieldset>
<fieldset>
<input name="email" placeholder="Email" type="email" tabindex="2" required>
</fieldset>
<fieldset>
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Pošalji</button>
</fieldset>
</form>
</div>
表2
<div id="form2">
<form id="contact2" action="" method="post">
<fieldset>
<input name="fname" placeholder="Ime" type="text" tabindex="1" required>
</fieldset>
<fieldset>
<input name="lname" placeholder="Prezime" type="text" tabindex="2" required>
</fieldset>
<fieldset>
<input name="tel" placeholder="Telefon" type="text" tabindex="2" required>
</fieldset>
<fieldset>
<input name="email" placeholder="Email" type="email" tabindex="2" required>
</fieldset>
<fieldset>
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Pošalji</button>
</fieldset>
</div>
jQuery的
$("#contact-submit").on("click", function() {
$("#contact").removeClass("visible");
$("#form2").addClass("visible");
});
所以出於某種原因THI s不工作。請幫我解決這個問題。我試圖設置第一種形式的opacity:0;
,但它不起作用。請讓我知道哪個文庫應該使用。
這是我的例子:http://codepen.io/anon/pen/PzKaPa
我假設您的表單實際上正在提交,導致您的頁面重新加載。你需要攔截表單提交。 – Jack
我會指出,你不應該使用不透明來隱藏和顯示的東西。它只是明顯地隱藏了元素。用戶仍然可以對元素做出反應。比如他們可以點擊不可見的輸入並開始輸入。然後提交表單。 –