0

私は次のことをしようとしています：各画像（サムネイル）をクリックすると、ソースが指定された入力に書き込まれる必要があります。私はそのようなことをしました...まだうまく機能していません！

  • どの画像がクリックされても、正しいソースは追加されず、常に最初のソースが追加されます。

  • 同じ/異なる画像をもう一度クリックしても、追加されたソースは削除されません。

// jQueryスクリプトの一部：

var imgSource = $('#textures li').find('img').attr('src');

$('ul#textures li img').on('click', function() {
    $('input#imgPath').val($('input#imgPath').val() + imgSource);
});​

理解を深めるためのフィドル： JSフィドルリンク

PSあなたの答えの説明をいただければ幸いです！

4

4 に答える 4

2

attr最初に一致した要素の属性のみを返しますthis。クリックした要素を参照するキーワードを使用できます。

$('ul#textures li img').on('click', function() {
    $('#imgPath').val(this.src)
});

http://jsfiddle.net/Uz6rc/

于 2012-11-10T17:47:46.070 に答える
1

use: $(this) - クリック要素の属性を意味します

 $('ul#textures li img').on('click', function() {
    $('input#imgPath').val($('input#imgPath').val() + $(this).attr('src'));
});​
于 2012-11-10T17:48:49.707 に答える
1

見てみましょう: http://jsfiddle.net/e3HzQ/

jQueryドキュメントから：

.attr() メソッドは、一致したセットの最初の要素のみの属性値を取得します。

imgSource変数はイベント ハンドラーの外部で宣言されているため、クリックされた画像によって値が変化することはありません。最初の画像の値が維持されるだけです。

また、既にある値に値を追加しているため、以前の値は削除されません。

于 2012-11-10T17:50:05.830 に答える
1

どうぞ：

$('ul#textures li img').on('click', function() {
    var imgSource = $('#textures li').find('img').attr('src');
    $('input#imgPath').val($(this).attr("src"));
});

デモ

それがうまくいかなかった理由は、あなたが定義したからです

var imgSource = $('#textures li').find('img').attr('src');

on 関数の外側。さらに、次を使用して、テキストボックス内に同じ値を毎回設定していました。

$('input#imgPath').val($('input#imgPath').val() + imgSource);

この行を変更して、この演算子を使用して img src を取得しました。

于 2012-11-10T17:51:07.830 に答える