项目遇到问题.md

项目遇到的问题

实现卡片选择效果时，先是使用e.target来判断点击的那个卡片，但是此时会出现多种选择情况的bug，导致选择效果混乱，而后来使用$(this)来控制显示的效果时就没有了bug。

改变前：

$('.manCard').click(function (e) {
        $(e.target).parent().addClass('cardActive');
        $(e.target).parent().siblings().removeClass('cardActive');
    })

改变后：

$('.manCard').click(function () {
        $(this).addClass('cardActive').siblings().removeClass('cardActive')
    })

js原生编写下拉列表： 先让文本框中显示一个初始的值，然后给文本框增加点击事件，点击之后将下拉列表的display属性改为反，然后给列表中的子项加点击事件，如果被点击就将li的值赋给文本框的innerHTML。

  <div id="dropDown">
    <span class="select">请选择游戏名称</span>
    <ul class="sub">
      <li>地下城与勇士</li>
      <li>魔兽世界（国服）</li>
      <li>魔兽世界（台服）</li>
      <li>热血江湖</li>
      <li>大话西游II</li>
      <li>QQ幻想世界</li>
    </ul>
  </div>

  <script>
    var oSelec = document.getElementsByTagName('span')[0];
    var oSub = document.getElementsByTagName('ul')[0];
    var aLi = document.getElementsByTagName('li');
    oSelec.onclick = function(event){
      var style = oSub.style;
      style.display = style.display=="block"? "none" : "block";
      (event || window.event).cancelBubble = true;
    };
    for(var i = 0;i < aLi.length;i++){
      aLi[i].onclick = function(){
        oSelec.innerHTML = this.innerHTML;
      }
      document.onclick = function(){
        oSub.style.display = "none";
      }
    }
  </script>