0

私は次のHTMLコードを持っています：

<ul id="contributorPhotos">
    <li>
        <img src="viewIcon.png" class="View">
        <img src="editIcon.png" class="Edit">
        <img src="deleteIcon.png" class="Delete">
        <form>
            [Form fields to manage first image here]
        </form>
    </li>

    <li>
        <img src="viewIcon.png" class="View">
        <img src="editIcon.png" class="Edit">
        <img src="deleteIcon.png" class="Delete">
        <form>
            [Form fields to manage second image here]
        </form>
    </li>
</ul>

そしてこれを制御する私のjQuery：

<script>
    $(".Edit").click(function() {
        $(this).find("form").css("background-color","#03C");
    });
</script>

ご覧のとおり、現在私がやろうとしているのは、現在の編集ボタンの下にあるフォームの背景色を変更することだけですが、壁にぶつかっています。

なぜこれが機能しないのか誰かが説明できますか？

4

5 に答える 5

3

.find（）は、選択した要素の子孫でのみ機能し、兄弟を探しています。

これを使って：

$(".Edit").click(function() {
    $(this).siblings("form").css("background-color","#03C");
});​

jsFiddleの例。

于 2012-04-10T17:19:18.243 に答える
1

$（this）.parent（）。find（ "form"）と言う必要があります

于 2012-04-10T17:16:40.557 に答える
1 
<script>
    $.document.ready( function() {
        $(".Edit").click(function() {
            $(this).find("form").css("background-color","#03C");
        });
    }
</script>

クリック関数がクリックイベントにバインドされていない可能性があります。

于 2012-04-10T17:17:26.723 に答える
0

うーん、フォームタグはリストタグでは許可されていないと言わざるを得ません...

編集：

David Byers、あなたを困らせることはありませんが、あなたのhtmlは間違っています...画像タグはリストタグで許可されていません..どちらもフォームタグではありません..cssでur'ボタン'に背景画像を追加する必要があります... htmlは次のようになります。

<div class="contributorPhotos">
        <!-- give background image and with to ur list tags -->
    <ul>
        <li class="View">View</li>
        <li class="Edit">Edit</li>
        <li class="Delete">Delete</li>
    </ul>

    <form>
        [Form fields to manage first image here]
    </form>
</div>
于 2012-04-10T17:16:56.833 に答える
0

代わりに使用してください：

$(".Edit").click(function() {
    $(this).closest('li').find("form").css("background-color","#03C");
});

あなたが直面している問題は、そのfind()仕組みです。現在の要素（この場合、$('.Edit')画像である要素は、内のセレクターによって定義された要素を探しますfind。画像に含めることはできません）上記の代替要素は、親要素に移動してから、その要素li内で。を検索します。form

次のものを使用することもできます。

$(".Edit").click(function() {
    $(this).siblings("form").css("background-color","#03C");
});

要素の兄弟要素の中から検索し$('.Edit')ます。

参照：

于 2012-04-10T17:22:37.290 に答える