如何在單擊鏈接時進行表單渲染？

我是javascript中的新手，我想在用戶單擊按鈕時呈現表單，但我嘗試了不同的方法，但未取得成功。這裏是代碼：如何在單擊鏈接時進行表單渲染？

<a href="" id="reply">Reply</a> 
<form action="" method="post" > 
    <textarea name="comment" class="comment_textarea"></textarea> 
    <input type="hidden" name="id" value="5"> 
    <input type="submit" class="btn" value="Reply"> 
</form>

我在線程註釋中使用它。我只想在用戶點擊回覆按鈕時呈現此表單，否則不應顯示此表單。

來源

2012-07-08 user1509863

正如@des說，你可以使用a#reply作爲觸發。 jQuery中只需要幾行代碼：

$('.reply').click(function() { 

    $(this).parent().find('.reply-form').toggle(); 


});

來源

2012-07-08 10:39:49 menislici

這是可行的，但要注意，它會切換**網站的所有**形式（可見表將被隱藏，隱藏將被顯示）。 – Zbigniew 2012-07-08 10:56:29

@des和menislici，我在網站上有線程註釋，請看http://jsfiddle.net/hLHJ3/2。我可以通過在第一條評論中按回復來切換表單，但其他回覆按鈕不起作用，我有這樣的長話，你有什麼想法，如何解決它？ – user1509863 2012-07-08 11:45:00

@ user1509863檢查我編輯的答案 – Zbigniew 2012-07-08 11:53:13

您可以使用CSS隱藏形式：

<a hred="" id="reply">Reply</a> 
<form action="" method="post" id="reply-form" style="display:none"> 
    <textarea name="comment" class="comment_textarea"></textarea> 
    <input type="hidden" name="id" value="5"> 
    <input type="submit" class="btn" value="Reply"> 
</form>

，然後顯示它當用戶點擊回覆按鈕：當我看到你的HTML

$('#reply').click(function() { $('#reply-form').toggle(); });

UPDATE現在：

首先，請不要將一個ID用於多個元素，請改爲使用class：

現在

<a hred="" class="reply">Reply</a>

可以使用next()切換形式：

// for each element with class reply, find next form element and toggle visibility 
$('.reply').click(function() { $(this).next('form').toggle(); });

來源

2012-07-08 10:28:03 Zbigniew

如何在單擊鏈接時進行表單渲染？

回答

相關問題