Question

 jQuery(document).ready(function() {
     jQuery("#bfCaptchaEntry").on("click", function(){
         jQuery("#bfCaptchaEntry").css("background-color", "#FFFFFF"); 
     });
     jQuery("#bfCaptchaEntry").on("blur", function(){           
         jQuery("#bfCaptchaEntry").css("background-color", "#CC0000"); 
     });
 });

这是代码，它应该添加onclick和onblur函数来更改输入字段的背景颜色，但它不起作用。

在此脚本之前加载jQuery代码，此脚本将在html中的单独文件中加载。

我做错了什么？任何帮助表示赞赏。

编辑：在答案中尝试了所有内容后，我在评论中尝试了Chase的建议。它就像一个魅力！因此，在加载jQuery之后，最终代码现在是一个内联脚本，它就像这样：

jQuery(document).ready(function() {
jQuery("#bfCaptchaEntry").bind("click", function(){ 
jQuery("#bfCaptchaEntry").css("background-color", "#FFFFFF"); });
jQuery("#bfCaptchaEntry").bind("blur", function(){ 
jQuery("#bfCaptchaEntry").css("background-color", "#CC0000"); });
});

Answer 1

你在加载jQuery之前加载了jQuery-reliant脚本。

  <script src="/templates/e-pasaporthome/javascript/styleForms.js" type="text/javascript"></script>
  <script src="/media/mod_vt_nivo_slider/js/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  <script src="/media/mod_vt_nivo_slider/js/jquery.nivo.slider.min.js" type="text/javascript"></script>

相反，将jQuery放在第一位;

  <script src="/media/mod_vt_nivo_slider/js/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  <script src="/templates/e-pasaporthome/javascript/styleForms.js" type="text/javascript"></script>
  <script src="/media/mod_vt_nivo_slider/js/jquery.nivo.slider.min.js" type="text/javascript"></script>

Answer 2

您是否首先包含了jQuery文件..如果您已经这样做了，那么在您的浏览器中点击F12并检查您是否在浏览器的控制台部分看到任何错误..

您还在使用其他JavaScript库吗？

Answer 3

对于1.7之前的版本，我建议使用.bind()代替.on()。

"As of jQuery 1.7, the .on() method provides all functionality required for attaching event handlers."

api.jquery.com/on/

Answer 4

在尝试答案中的所有内容之后，我在评论中尝试了Chase的建议。它就像一个魅力！因此，在加载jQuery之后，最终代码现在是一个内联脚本，它就像这样：

jQuery(document).ready(function() {
jQuery("#bfCaptchaEntry").bind("click", function(){
jQuery("#bfCaptchaEntry").css("background-color", "#FFFFFF"); });
jQuery("#bfCaptchaEntry").bind("blur", function(){ 
jQuery("#bfCaptchaEntry").css("background-color", "#CC0000"); });
});

调试一个简单的jQuery函数;想知道是否与另一个代码发生冲突？

4 个答案: