jQuery 01--おすすめアルバムは、オーディションのようです

新年が来て、私达の商戸センターのプロジェクトもみんなの努力の下で期日通りにオンラインになりました.かつてずっと難易度の大きいものは自分でできないと思って、簡単に書いてまたみんなの冗談を心配して、実はただ自分の怠惰な探しの口実にすぎません.おすすめアルバムをセットして、自分のこのプロジェクトでの収穫をまとめましょう.下図のように、左側は業者のすべてのアルバムで、右側は推薦アルバムです.左でおすすめのアルバムをクリックすると、該当する位置に赤い枠が表示され、選択されたものは右側のリストに表示され、上限は8つです.推薦を取り消すには、右側の削除ボタンをクリックし、左側の対応する赤い枠も消えます.最後に、ページ右下の「提出」ボタンをクリックすると設定が完了します.個人的には、おすすめアルバムの設定は、まるでオーディションのようで、今回は8つの定員を設定します.所有者はすべてのアルバムの中から重複しないアルバム(最大8個)を1つずつ抽出し、抽出されたアルバムはマークされ、「影」を派遣して自分の身分証明書を持って右側に行きます.これらの影は主人の二次スクリーニングを受ける可能性があり、原籍に戻されることもあり、対応するマークも削除されます.最終的に勝利したのは、店の名誉を象徴する推薦アルバムだ.
まず、構造を配置する必要があります(ここではスタイルを省略します):
左側ulのid=「all」、右側ulのid=「albumlist」.
次に、タスクを分析し、考え方を整理します.

1.     li ：
$("#all li").click(function(){
 （1）     li    ---checked。
    $(this).addClass('checked');
 （2）   li    src，input value，    。 li                  。
    var imgsrc = $(this).find('img').attr('src'),
        val = $(this).find('input').attr('value'), 
        pval = $(this).find('p').html(); 
    $('#albumList').append('<li>'+'<input type="hidden" name="'+type+'[]" value="'+val+'"><b class="del"></b><img src="'+imgsrc+'"/><p>'+pval+'</p></li>');
});
（3）    ，     8   。  ，        max，    max   。     li     8 ，            。
var max = <?=$max?>;
$("#all li").click(function(){
     var imgsrc = $(this).find('img').attr('src'),
         val = $(this).find('input').attr('value'), 
         pval = $(this).find('p').html(); 
     if($('#albumList').find('li').length<max&&!($(this).hasClass('checked'))){
         $(this).addClass('checked');
         $('#albumList').append('<li>'+'<input type="hidden" name="'+type+'[]" value="'+val+'"><b class="del"></b><img src="'+imgsrc+'"/><p>'+pval+'</p></li>');
     }else if($('#albumList').find('li').length>=max){
         alert("      "+max+"  ，      ");
     }
});