0

こんにちは、ディレクトリ内のファイルのリストと、ユーザーが名前を付けることができる各ファイルの下のフォームが必要です。それはすべて明らかです-私はphpで作成しましたが、このリストと非表示のフォームが必要であり、ファイルの名前の1つをクリックすると、クリックした名前の下にフォームが表示されます。

ここのようなもの: http://papermashup.com/demos/jquery-sliding-div/#

コードは次のとおりです。http://papermashup.com/simple-jquery-showhide-div/

しかし、ファイルの1つをクリックすると、すべてのフォームが表示されるか、すべてが非表示になるように機能します。クリックしたファイルに対してのみ機能するように修正するにはどうすればよいですか?

JSFIDDLE の例: http://jsfiddle.net/qbNrR/

@UPDATE - 同様の問題

ねえ、私はajaxフォームを送信する際に同様の問題を抱えています - このチュートリアルを使用して: http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

私のフォームは div id=#upform にあり、$.ajax を介してそれらのいずれかを送信しようとすると、最初のフォームのみが送信されます。コードは次のとおりです。

<script> 
 $(function() {
    $(".button").click(function() {
        var txt = $(".tekst#test").val();
        var dataString = 'tekst=' + tekscior;
        $.ajax({
            type: "POST",
            url: "upload/base",
            data: dataString,
            success: function() {
                $('#upform').html("<div id='message'></div>");
                $('#message')
                    .html("<h2>described!</h2>")
                    .append("<p>thanks!</p>")
                    .hide()
                    .fadeIn(1500, function() {
                        $('#message')
                            .append("<img id='checkmark' src='http://artivia-dev2/i/check.png' />");
                });
            }
        });
        return false;
    });
});​
</script>

そして、ここに私のフォームがあります:

// 2 番目のものを提出している場合でも、これだけが提出されます!

<div class="slidingDiv">
<div id="upform">
<form name="contact" action="">  
<input type="text" value="TESTFORM" class="tekst" id="test">
<input type="submit" name="submit" class="button" id="submit" value="Send" />
<form>
</div> 


<div class="slidingDiv">
<div id="upform">
<form name="contact" action=""> 
<input type="text" value="TESTFORM" class="tekst" id="test">
<input type="submit" name="submit" class="button" id="submit" value="Send" />
<form>
</div>
4

3 に答える 3

2

next()jQuery メソッドを使用できます。次に、コードは次のようになります。

$(document).ready(function() {
    $(".slidingDiv").hide();
    $(".show_hide").show();
    $('.show_hide').click(function(e) {
        $(e.target).next(".slidingDiv").slideToggle();
    });
});​
于 2012-05-25T09:22:56.647 に答える
0

event.currentTarget を試して、クリック イベントをトリガーしたフォームを取得してください

于 2012-05-25T09:07:49.873 に答える
0

クリックイベントでjqueryを使用

$(this).show(); // or hide();

例のように

$('.show_hide').click(function(){
  //$(".slidingDiv").slideToggle();
  $(this).slideToggle();
});
于 2012-05-25T09:10:36.330 に答える