0

私の経験レベル - カスタム スライダーを作成していますが、jQuery を使用するのはこれが初めての経験ですが、html、css、jquery が一緒に何をするかについてはかなりよく理解できていると思いますが、まだ初心者の気持ちが続いています。

私の問題 - そのようにマークアップされた 17 個の div があり、img タグを削除したいと思います。

      <div class="slide" id="zero">
        <h2>April 1, 2011</h2>
        <img src="img/1_april12011.png"/><p>Lorem Ipsum</p>
      </div>
      <div class="slide" id="one">
        <h2>April 2011</h2>
        <img src="img/2_april2011.png"/> <p>Lorem Ipsum</p>
      </div>
      <div class="slide" id="two">
        <h2>August 2011</h2>
        <img src="img/3_aug2011.png"/><p>Lorem Ipsum</p>
      </div>

.detach() と次の jQuery を使用すると、これを非常に簡単に行うことができます。

 $('.slide').delegate('click', function(){ 
      if(imageToAttach == null){
        attachLocation = $(this).find('id');
        imageToAttach = $(this).find('img').detach();
        console.log
      }else{
        $(imageToAttach).appendTo(attachLocation);
        console.log('trying to append ' + imageToAttach + ' to ' + attachLocation);
        attachLocation = $(this).find('id');
        imageToAttach = $(this).find('img').detach();
        console.log('detached ' + imageToAttach);
      }});

var = imageToAttach と attachLocation を使用して、削除された画像と削除された場所を追跡しているので、必要に応じてその特定の div に再度追加できます (別の画像がクリックされたとき、または左右のコントロールがクリック) それで、これを手に入れることができれば -- http://jsfiddle.net/lorenzo_vm/nbF8d/3/ -- jsfiddle が動作するようになれば、やりたいことができると思います。

数時間の調査とその後のいじり

やりたいことはわかったと思います.hide()と.show()を使用しますが、上記のフィドルで何が起こっているのかまだ興味があります...つまり、どうすればよいですか別のdivをクリックしたときに元の同じdivに再挿入されるようにimgを取得します...そして、親切なstackoverflowユーザーでよろしければ、divを割り当てる簡単な方法も教えていただけますかid="zero" id="one" などを使用する代わりに、ある種の配列。

このようなもの？

var slides = $('.slide');
var numberOfSlides = slides.length;
var slideArray[] = null;

for ループを使用して、slides.length のインデックスを配列内の各スポットに割り当てますか?

for( var i=0;i<=numberOfSlides;i++){
   slideArray[i] = ?;
}

または、変数スライドは配列ですか? 私は少し混乱しています。

本当にありがとう！

  • マイケル
4

1 に答える 1

0

ここ。私はあなたのフィドルを更新して、あなたが探しているものだと思うことを実行しました-ほとんど。この振る舞いは私には奇妙で、なぜこれをやりたいのか正確にはわかりません...

http://jsfiddle.net/nbF8d/12/

関連するコードは次のとおりです。これは次のように要約できます。

$(document).ready(function(){
    var imageToAttach;
    var attachLocation;

    $('.slide').on('click', function(){ 
      if(imageToAttach != null){
        $(imageToAttach).appendTo(attachLocation);
      }

      attachLocation = $(this);
      imageToAttach = $(this).find('img').detach();
   });
});
​

基本的に、クリックされた要素への参照を保存する必要があるときに、要素の「id」を見つけようとしていました。

attachLocation = $(this);

そうすれば、appendTo には id の値だけでなく要素があります ( を使用して実際の id をフェッチしたと仮定します$(this).attr('id')) 。

また、あなたの例では、変数を宣言したり、リスナーを準備完了呼び出しに配置したりしませんでした。

また、 .delegateの代わりに.onに切り替えたことにも注意してください。「jQuery 1.7 以降、.delegate() は .on() メソッドに置き換えられました」を参照してください。

于 2012-10-23T21:53:08.863 に答える