Question

我有这个盒子，当点击（获得课堂）时会在一个更大的盒子中进行转换。但它只需要点击2次，而不仅仅需要一次点击。

.clientes {width:170px;height:27px;background-image:url('../imagens/clients.gif');-webkit-transition:1s;}
.clientes-clicked {width:356px !important;height:154px !important;background-image:url('../imagens/clients-big.png') !important;-webkit-transition:1s;}

<script>    
    var clientesclick = function(){
    $('.clientes').on('click', function(e) {
      $('.clientes').toggleClass("clientes-clicked"); //you can list several class names 
      e.preventDefault();
    });
    }
</script>

Answer 1

尝试这样

<script>   
    $(document).ready(function() {
        $('.clientes').on('click', function(e) {
          $('.clientes').toggleClass("clientes-clicked"); //you can list several class names 
          e.preventDefault();
        });
    });
</script>

不太确定为什么要将它分配给变量，但它不会立即运行，而是在调用该方法时执行（我猜这是第一次点击）然后你的dom元素会有事件（第二次点击）。

使用$（document）.ready它将在所有dom准备就绪后运行，然后当你第一次点击你的元素时它们应该已经有了事件

Answer 2

你让它变得比它需要的更复杂。你可以这样做：

$('.clientes').click(function(){
    $(this).toggleClass('clientes-clicked');
});

小提琴：http://jsfiddle.net/64XQ3/

并且，正如上面所指出的，你的jQuery应该包含在

中

$(document).ready(function(){
    // code here
});

Javascript onclick需要两次点击

2 个答案: