Question

我目前正在this link创建一个页面。我在我的标题中使用这个javascript（在我的CSS下面）：

<script type="text/javascript" src="http://static.tumblr.com/txc9jrr/yNxmd3lq6/jquery.js">   
</script>

<script type="text/javascript">
$('.toggle').click(function(){
    var $tr = $(this).closest('tr');
    $tr.add($tr.next('.edit')).toggle();
});
$('.cancel').click(function(){
    var $tr = $(this).closest('tr');
    $tr.add($tr.prev('.view')).toggle();
});
</script>

和这个HTML：

<table>
  <tr class="view">
      <td>
          <a class="toggle" class="icon-button" href="#">Edit</a>
      </td>
  </tr>
  <tr class="edit" style="display:none">
      <td>
          hi
          <a class="cancel" href="#">Cancel</a>
      </td>
  </tr>
</table>

从理论上讲，它应该有效...但是当我将它实现到我的页面中时，它就不再起作用了。有没有人知道我的问题是什么？

Answer 1

变化

<a class="toggle" class="icon-button" href="#">Edit</a>
   // ^--------------^---------------------Cannot define two classes like this

到

<a class="toggle icon-button" href="#">Edit</a>
 //  ^--------------------------------Try like this

DEMO

Answer 2

我认为你应该试试这个

$('.toggle').click(function(){

 if ($(".edit").css('display') == 'none') {

      $(".edit").css('display', 'block');
  }
}

我认为这会对你有所帮助

jQuery单击以显示/隐藏无法正常运行

2 个答案:

DEMO