Question

我想用toggle（）制作以下示例。

function showforces(id)
{
       if( document.getElementById('combatforces'+id).style.display != 'block')
      {
        document.getElementById('combatforces'+id).style.display = 'block';
        document.getElementById('details'+id).innerHTML = 'Hide Forces';
      }
      else
      {
        document.getElementById('combatforces'+id).style.display = 'none';    
        document.getElementById('details'+id).innerHTML = 'Show Forces';
      }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<div class="placecombatlarge" onclick="showforces(1)">
    <div  id="details1">
           Hide Forces
    </div>
    <div class="combatforces" id="combatforces1">
           Some Text
    </div>
</div>

但如果我使用

function showforces(id)
    {
      $('combatforces'+id).toggle("slow", "swing");
    }

它不起作用。如果我写

function showforces(id)
    {
      $(combatforces1).toggle("slow", "swing");
    }

它有效。

第二个问题：如果切换或不切换，我如何更改内部Html的详细信息？

非常感谢：）

Answer 1

function showforces(id)
{
  if ($( '#combatforces'+id ).is( ":visible" ))
  {    
    document.getElementById('details'+id).innerHTML = 'Show Forces';
  }
  else
  {
    document.getElementById('details'+id).innerHTML = 'Hide Forces';
  }
  $('#combatforces'+id).toggle("slow", "swing");
}

它的工作。 ;）感谢帮助（id选择器）：）

Jquery用id切换

1 个答案: