隐藏类后,.show()无效

时间:2016-01-06 00:25:49

标签: javascript jquery

所以我试图在隐藏元素后显示由click事件触发的内容。我不能为我的生活找出为什么.show()不起作用。我已经尝试了所有我能想到的东西。我现在所拥有的是:

function hideArrows(index){
  var hiddenId = parseInt($(".queueListDiv .track").first().attr("id"), 10);
  console.log("hiddenId = " + hiddenId + currentIndex)
    if(index == hiddenId){
      console.log("true son")
      $("#" + hiddenId + " .soundMove").hide();
      $("#" + (hiddenId + 1) + " .fa-arrow-up").hide();
    } 
}

function showArrows(){
  $(".queueListDiv .track").each(function(){
    var otherId = parseInt($(this).attr("id"))
    if (otherId > 1){
      $(this).attr(".queueListDiv .track .soundMove .fa-arrow-up").show()
    }
  })
}

HTML看起来像这样:

<div id="queueList" class="queueListDiv col-md-4">
      <div class='track' id='this is some number'>
        <div class="soundMove">
          <i class="moveUp fa fa-arrow-up"></i>
          <i class="moveDown fa fa-arrow-down"></i> 
        </div>
      </div>
</div>

showArrows的回调是在点击事件中回调hideArrows回调之后。

2 个答案:

答案 0 :(得分:0)

这只是一个猜测,但工作。所以我发布它作为答案。让OP检查它是否有效,然后让它成为,否则我将删除它。

优良作法是让id不要以数字开头或完全由数字组成。所以尝试在前面添加一些字符。

您的HTML必须如下:

<div id="queueList" class="queueListDiv col-md-4">
  <div class='track' id='track-{number}'>
    <div class="soundMove">
      <i class="moveUp fa fa-arrow-up"></i>
      <i class="moveDown fa fa-arrow-down"></i> 
    </div>
  </div>
</div>

你的jQuery代码可以是:

function hideArrows(index){
  var hiddenId = parseInt($(".queueListDiv .track").first().attr("id"), 10);
  console.log("hiddenId = " + hiddenId + currentIndex)
  if(index == hiddenId){
    console.log("true son")
    $("#track-" + hiddenId + " .soundMove").hide();
    $("#track-" + (hiddenId + 1) + " .fa-arrow-up").hide();
  } 
}

function showArrows(){
  $(".queueListDiv .track").each(function(){
    var otherId = parseInt($(this).attr("id").replace("track-", ""))
    if (otherId > 1){
      $(this).attr(".queueListDiv .track .soundMove .fa-arrow-up").show()
    }
  })
}

答案 1 :(得分:0)

感谢所有帮助过的人...我能够弄清楚。我已经意识到我实际上需要在我的条件下使用hiddenId变量,所以我只是写了一个函数,如下所示:

function hideOrShowArrows(index){
  var hiddenId = parseInt($(".queueListDiv .track").first().attr("id"), 10);
  console.log("hiddenId = " + hiddenId + currentIndex)
    if(index == hiddenId){
      console.log("true son")
      $("#" + hiddenId + " .soundMove").hide();
      $("#" + (hiddenId + 1) + " .fa-arrow-up").hide();
    } 
  $(".queueListDiv .track").each(function(){
    var otherId = parseInt($(this).attr("id"))
    if (otherId > (hiddenId + 1)){
      $("#" + otherId + " .fa-arrow-up").show()
    }
  })
}