jQuery onclick 函数:未定义不是一个函数

jQuery onclick function: Undefined is not a function

本文关键字：函数 一个 onclick 未定义 jQuery      更新时间：2023-09-26

编辑：我想这部分是我对Drupal缺乏经验的问题。我在 site.info 中添加了一个javascript文件，以便将其添加到每个页面。这是文件包含的所有内容：

(function ($){
$("#ctl00_btnSearch001").on("click", function(){
       var searchVal = $("#ctl00_txtSearch").val();
       window.location.href = "http://www.mywebsite.org/search/?sa=Search&q=" + searchVal;         
    });    
})(jQuery);

当站点加载时，它被编译成这个更大的脚本，在调试器中如下所示：

    (function ($) {
  Drupal.behaviors.titlebar = {
    init: function(context, settings) {
      // Using percentage font size to easily increase/decrease page font size
      var baseFontSize = 100;
      $('.pgc-font-size a').click(function() {
        if($(this).hasClass('increase')) {
          if(baseFontSize < 150)
            baseFontSize += 20;
          $('.pg-content-body p').css('font-size', baseFontSize+'%');
        } else {
          if(baseFontSize > 70)
            baseFontSize -= 10;
          $('.pg-content-body p').css('font-size', baseFontSize+'%');
        }
      });
      // Print button
      $('.pgc-print a').click(function() {
        window.print();
      })
    }
  };
}(jQuery));
// There's a problem with our jQuery loading before the ingested site's
// jQuery which is causing jQuery plugins to break (the "once" plugin in this case).
// I'm using this workaround for now
jQuery(function() {
  Drupal.behaviors.titlebar.init();
});;
(function ($) {
  Drupal.behaviors.giftTypes = {
    init: function() {
      // Gift details accordion
      $('.pg-gift-details .accordion-items').css('display', 'none');
      $('.pg-gift-details .accordion-switch').click(function(){
        if($(this).hasClass('open')) {
          $(this).find('span').removeClass('icon-arrow-up').addClass('icon-arrow-down');
          $('.pg-gift-details .accordion-items').slideUp('slow');
          $(this).html($(this).html().replace('Hide', 'Show More'));
          $(this).removeClass('open');
        } else {
          $(this).find('span').removeClass('icon-arrow-down').addClass('icon-arrow-up');
          $('.pg-gift-details .accordion-items').slideDown('slow');
          $(this).html($(this).html().replace('Show More', 'Hide'));
          $(this).addClass('open');
        }
      })
    }
  }
}(jQuery));
// There's a problem with our jQuery loading before the ingested site's
// jQuery which is causing jQuery plugins to break (the "once" plugin in this case).
// I'm using this workaround for now
jQuery(function() {
  Drupal.behaviors.giftTypes.init();
});;
(function ($){
$("#ctl00_btnSearch001").on("click", function(){
    var searchVal = $("#ctl00_txtSearch").val();
    alert(searchVal);
    window.location.href = "http://www.mywebsite.org/search/?sa=Search&q=" + searchVal;
  });
})(jQuery);
;

你可以在底部看到我的小脚本。它说第一行有问题，但我不确定问题是什么。我需要对我的javascript文件进行什么更改以确保它正确编译？

我可能忽略了一个非常简单的类型，但我看不出我的jQuery有什么问题。

这是不起作用的部分：

(function ($){
    $("#ctl00_btnSearch001").on("click", function(){
        var searchVal = $("#ctl00_txtSearch").val();
        window.location.href = "http://www.website.org/search/?sa=Search&q=" + searchVal;
    });
})(jQuery);

我的网站上有jQuery，我知道我这样做，因为它在代码的前面没有问题。错误显示在调试器的第一行'$（"#ct100_btnSearch001"）.on（"click"， function（）{ '。 下面是脚本页面的较大部分：

(function($) {
    Drupal.behaviors.giftTypes = {
        init: function() {
            // Gift details accordion
            $('.pg-gift-details .accordion-items').css('display', 'none');
            $('.pg-gift-details .accordion-switch').click(function() {
                if ($(this).hasClass('open')) {
                    $(this).find('span').removeClass('icon-arrow-up').addClass('icon-arrow-down');
                    $('.pg-gift-details .accordion-items').slideUp('slow');
                    $(this).html($(this).html().replace('Hide', 'Show More'));
                    $(this).removeClass('open');
                } else {
                    $(this).find('span').removeClass('icon-arrow-down').addClass('icon-arrow-up');
                    $('.pg-gift-details .accordion-items').slideDown('slow');
                    $(this).html($(this).html().replace('Show More', 'Hide'));
                    $(this).addClass('open');
                }
            })
        }
    }
}(jQuery));
jQuery(function() {
    Drupal.behaviors.giftTypes.init();
});;
(function($) {
    $("#ctl00_btnSearch001").on("click", function() {
        var searchVal = $("#ctl00_txtSearch").val();
        alert(searchVal);
        window.location.href = "http://www.mywebsite.org/search/?sa=Search&q=" + searchVal;
    });
})(jQuery);;

尝试安装 jQuery update Module。

如果您使用的是Drupal 6，则无法使用on功能。

一种选择是将自定义版本的jQuery包含在page.tpl.php中，另一种选择（不推荐）是使用live，但现在已被弃用。

可以使用两种方式将函数绑定到事件：

1.使用 bind（） 方法和事件名称作为第一个参数

$( "#foo" ).bind( "click", function() {
alert( "User clicked on 'foo.'" );
});

或

2.只使用事件方法

$( "#foo" ).click( function() {
alert( "User clicked on 'foo.'" );
});

代码的问题在于没有on事件。 参考文献 http://api.jquery.com/category/events/mouse-events/

如果

ctl00_btnSearch001是您尝试单击的任何内容的正确 ID。尝试将其更改为以下内容：

(function ($){
    $(document).on("click", "#ctl00_btnSearch001", function(){
       var searchVal = $("#ctl00_txtSearch").val();
       window.location.href = "http://www.mywebsite.org/search/?sa=Search&q=" + searchVal;         
    });    
})(jQuery);
相关文章：