类型错误: $(..).查找(..).on 不是一个函数
TypeError: $(...).find(...).on is not a function
我必须管理一个很小的网络演示,只有一些javascript。它是几年前写的,现在我尝试实现移动兼容菜单。
以下是在我开始使用新菜单之前安装的jQuery版本:jQuery.min.js : jQuery JavaScript Library v1.6.1jQuery.tools.overlay.min.js : jQuery Tools v1.2.7 - Web 缺少的 UI 库jQuery-ui.min.js : jQuery UI 1.8.13
现在我尝试几个较新的jQuery代码,目前我使用此版本:
<script src="scripts/jquery-1-12-3.min.js" type="text/javascript"></script>
<script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>
我想用于菜单的插件是"doubletaptogo.js":
(function($) {
/*
Responsive Flat Menu
http://cssmenumaker.com/menu/responsive-flat-menu
*/
$.fn.menumaker = function(options) {
var cssmenu = $(this),
settings = $.extend({
title: "Menu",
format: "dropdown",
sticky: false
}, options);
return this.each(function() {
cssmenu.prepend('<div id="menu-button">' + settings.title + '</div>');
$(this).find("#menu-button").on('click', function() {
$(this).toggleClass('menu-opened');
var mainmenu = $(this).next('ul');
if (mainmenu.hasClass('open')) {
mainmenu.hide().removeClass('open');
} else {
mainmenu.show().addClass('open');
if (settings.format === "dropdown") {
mainmenu.find('ul').show();
}
}
});
cssmenu.find('li ul').parent().addClass('has-sub');
multiTg = function() {
cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
cssmenu.find('.submenu-button').on('click', function() {
$(this).toggleClass('submenu-opened');
if ($(this).siblings('ul').hasClass('open')) {
$(this).siblings('ul').removeClass('open').hide();
} else {
$(this).siblings('ul').addClass('open').show();
}
});
};
if (settings.format === 'multitoggle') multiTg();
else cssmenu.addClass('dropdown');
if (settings.sticky === true) cssmenu.css('position', 'fixed');
resizeFix = function() {
if ($(window).width() > 768) {
cssmenu.find('ul').show();
}
if ($(window).width() <= 768) {
cssmenu.find('ul').hide().removeClass('open');
}
};
resizeFix();
return $(window).on('resize', resizeFix);
});
};
})(jQuery);
/*
By Osvaldas Valutis, www.osvaldas.info
Available for use under the MIT License
*/
;
(function($, window, document, undefined) {
$.fn.doubleTapToGo = function(params) {
if (!('ontouchstart' in window) &&
!navigator.msMaxTouchPoints &&
!navigator.userAgent.toLowerCase().match(/windows phone os 7/i)) return false;
this.each(function() {
var curItem = false;
$(this).on('click', function(e) {
var item = $(this);
if (item[0] != curItem[0]) {
e.preventDefault();
curItem = item;
}
});
$(document).on('click touchstart MSPointerDown', function(e) {
var resetItem = true,
parents = $(e.target).parents();
for (var i = 0; i < parents.length; i++)
if (parents[i] == curItem[0])
resetItem = false;
if (resetItem)
curItem = false;
});
});
return this;
};
})(jQuery, window, document);
/**
* doubleTapToGoDecorator
* Adds the ability to remove the need for a second tap
* when in the mobile view
*
* @param {function} f - doubleTapToGo
*/
function doubleTapToGoDecorator(f) {
return function() {
this.each(function() {
$(this).on('click', function(e) {
// If mobile menu view
if ($('#menu-button').css('display') == 'block') {
// If this is not a submenu button
if (!$(e.target).hasClass('submenu-button')) {
// Remove the need for a second tap
window.location.href = $(e.target).attr('href');
}
}
});
});
return f.apply(this);
}
}
// Add decorator to the doubleTapToGo plugin
jQuery.fn.doubleTapToGo = doubleTapToGoDecorator(jQuery.fn.doubleTapToGo);
/**
* jQuery
*/
(function($) {
$(document).ready(function() {
$("#cssmenu").menumaker({
title: "Menu",
format: "multitoggle"
});
$('#cssmenu li:has(ul)').doubleTapToGo();
});
})(jQuery);
菜单如下所示:
<nav id='cssmenu' role='navigation'>
<a href="#cssmenu" title="Show navigation">Show navigation</a>
<a href="#" title="Hide navigation">Hide navigation</a>
<ul>...
。当我使用 Firebug 调试时,我总是看到这篇文章主题中提到的错误!
jQuery的版本还有问题吗?我很抱歉,但我不太习惯用javascript编程。
非常感谢您的帮助!
我现在添加
<script type="text/javascript" src="scripts/jquery-ui.min.js" ></script> // v1.11.4
我将带有该代码的doubletaptogo绑定到我的html正文中:
<script type="text/javascript">
$(function () {
$('.cssmenu').doubleTapToGo();
});
</script>
到目前为止,不幸的是它不起作用。有了这个doubletaptogo.min.js我的笔记本电脑上有一个很好的菜单,Firebug没有错误,但我的移动设备上没有菜单:
;(function(e,t,n,r){e.fn.doubleTapToGo=function(r){if(!("ontouchstart"in t)&&!navigator.msMaxTouchPoints&&!navigator.userAgent.toLowerCase().match(/windows phone os 7/i))return false;this.each(function(){var t=false;e(this).on("click",function(n){var r=e(this);if(r[0]!=t[0]){n.preventDefault();t=r}});e(n).on("click touchstart MSPointerDown",function(n){var r=true,i=e(n.target).parents();for(var s=0;s<i.length;s++)if(i[s]==t[0])r=false;if(r)t=false})});return this}})(jQuery,window,document);
使用doubletaptogo.js Firebug中存在错误(如主题中所述),但是我的笔记本电脑上有一个很好的菜单,而我的移动设备上有一个"菜单",它对任何事情都没有反应。我还尝试针对过滤器()更改find(),但过滤器()"不是函数"。
还有什么问题?我还尝试仅使用该站点的代码作为菜单,只是为了在我的站点上显示它:http://codepen.io/dmitrykiselyov/pen/XJwqZM...这也行不通。我的移动设备上只有"菜单"没有反应。那么,可能是jQuery的问题?我现在使用 jquery-1-12-3.min.js UI 是版本 v1.11.4。可能是一个糟糕的组合?
我遇到了同样的错误,解决方案是请使用 1.x.y 系列中最新的 jQuery 版本(您可以在这里选择:https://code.jquery.com/jquery/1.12.4 对我来说效果很好)。
- 创建一个类似链接的按钮,并通过Javascript函数打开一个新的弹出窗口
- 我可以在json对象中添加一个函数吗
- Javascript使函数一个接一个地执行
- 是JavaScript中的函数一个对象
- 两个几乎相等的jQuery函数;一个适用于IE,一个不适用于IE
- 两个Javascript函数一个window.onload=Custom.init;和一个window.onload=f
- 使javascript加载函数一个接一个地执行
- 如何通过两个嵌套的匿名函数(一个带有超时的事件处理程序)传递变量
- 为什么我不能让两个jQuery函数一个在另一个里面呢?
- 给函数一个变量名,而不是它的值
- 如何使用嵌入函数(一个滚动页由Pete - peachananr)
- 是否有可能给JavaScript函数一个类型/类?
- 确保两个函数一个接一个地执行,其中第一个函数内部有一个异步调用
- 两个不同的ajax函数一个接一个调用返回相同的值
- jQuery第一次更改函数一个工作
- 给这个函数一个id
- 如何给回调函数一个值一个变量在特定时刻
- 使用回调使两个函数一个接一个地运行
- 两个函数(一个用php)是否可以用“;onclick”;
- 两个几乎相同的函数.一个函数用Queue进行排队.Jquery效果在queued函数上不起作用.为什么