0

jQuery UI のドラッグ アンド ドロップ機能を使用して、アルバムの画像を選択します。rel パラメーターに保存されているイメージ ID。イメージのドロップ後に入力要素にコピーする必要があります。

画像一覧はこちら。ドラッグ可能の使用

<img src="01.jpg" title="image 01" rel="10" />
<img src="02.jpg" title="image 02" rel="11" />
<img src="03.jpg" title="image 03" rel="12" />

ここにドロップ:

<div id="dropzone">
    <div id="imgcontainer"></div>
    <input type="text" name="img_id" id="img_id" />
</div>

ドロップ可能な JS コードは次のとおりです。

$('#dropzone').droppable({
    hoverClass: 'bgSelected',
    drop: function(event, ui) {
        $(this).html(''); // to remove any other stuffs
        var img = ui.draggable;
        $('<img src="'+img.prop('src')+'" title="'+img.prop('title')+'">').appendTo( $(this) );
        $('<input type="text" name="img_id" id="img_id" value="'+img.prop('rel')+'" />').appendTo( $(this) );
    },
});

そして img.prop('rel') は空の文字列で戻ります。img.attr('rel') を使用しようとしましたが、それはオブジェクト要素を返します。「rel」値を取得するにはどうすればよいですか?

4

3 に答える 3

2

attr小道具のinstedを使用できます。お気に入り ..

$(function() {
  $('#dropzone').droppable({
    hoverClass: 'bgSelected',
    drop: function(event, ui) {
         var img = ui.draggable;
        //alert($(ui.draggable));
        var id =img.attr('rel');


    $(this).html(''); // to remove any other stuffs

     $('<img src="'+img.prop('src')+'" title="'+img.prop('title')+'">').appendTo( $(this) );
      $('<input type="text" name="img_id" id="img_id" value="'+id+'" />').appendTo( $(this) );
    },
  });

これはフィドルのリンクですhttp://jsfiddle.net/fLJuB/19/

于 2012-09-21T07:03:50.210 に答える
0 
alert($("#img").attr("rel"));

.attr("rel") を使用する場合。text()は機能しません。

于 2012-09-21T07:03:30.047 に答える
0

ui.draggable を使用してオブジェクト内の他のプロパティを取得する場合は、jquery セレクターを使用できます。たとえば、img.prop('src')src属性を返す場合、それを使用してjquery属性セレクターで画像を選択できます

alert($('img[src="' + img.prop('src') + '"]').attr('rel'));

EDITED：こんにちは、これはうまくいくと思います->リンク

于 2012-09-21T07:21:26.560 に答える