Question

我正在尝试使用jquery切换一个按钮类，但它不起作用，这里是代码：

.botaoclique{
    box-shadow: 0px 0px 00px #000000;
}
.formulario-rodape{
    box-shadow: 0px 0px 00px #000000;
}
<input class="cat_button formulario-rodape botao-verde" type="submit" value="Subscrever" id="catlistbutton" /></div>
            <script type="text/javascript">
$( "input.formulario-rodape" ).click(function() {
  $( this ).toggleClass( "botaoclique" );
});
</script>

我做错了什么？

你可以在这里看到它： http://ocozinheiroperfeito.businesscatalyst.com/

Answer 1

您的代码无法正常工作，因为您收到此错误：

ReferenceError: $ is not defined

解决方案：在使用jquery之前，您应该在页面中包含jquery库。

使用以下代码包含jquery库：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

Answer 2

您的代码没问题。检查the fiddle。
当我打开您的网站时，我看到以下控制台错误：

Uncaught ReferenceError: $ is not defined

您应该在使用之前添加JQuery引用。

Answer 3

除了其他答案之外，您还需要将单击处理程序定义包装在document.ready（）中，否则在引发任何单击事件之前不会“及时”添加事件侦听器。

<script type="text/javascript">
   $(document).ready(function(){
      $( "input.formulario-rodape" ).click(function() {
         $( this ).toggleClass( "botaoclique" );
      });
   });
</script>

Answer 4

问题是你在页面底部包含jQuery，但是你有代码在此之前使用jQuery。

所以要么将jQuery include移动到标题

<script src="https://code.jquery.com/jquery.js"></script>

或者在包含jQuery

之后将使用jQuery的所有脚本块移动到页面底部

切换类与Jquery无法正常工作

4 个答案: