javascript 未捕获的类型错误：无法读取 null 的属性“on”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32033591/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Uncaught TypeError: Cannot read property 'on' of null
提问by Uncle Kracker
I'm getting this Uncaught TypeError:
我收到这个未捕获的类型错误：
I'm unsure what is causing it, maybes something to do with JQuery?
我不确定是什么原因造成的，也许与 JQuery 有关？
Here is the exact code:
这是确切的代码：
//when add to cart link is clicked...
$('.addtocart').on('click', function(){
//get the value of the "data-value" attribute for that link
var vehicleRegistration = $(this).data('value');
//save it to localStorage
localStorage.setItem('vehicleRegistration', vehicleRegistration);
//read from localStorage
if( localStorage.getItem('vehicleRegistration') ){
//add the value to the form input
$('#field34').val( localStorage.getItem('vehicleRegistration') );
}
});
Here is the page that it is happening on: http://drivencarsales.co.uk/book-testdrive
这是它发生的页面：http: //drivencarsales.co.uk/book-testdrive
It's really got me stumped, if anyone can help me solve this it would be much appreciated.
这真的让我很难过，如果有人能帮我解决这个问题，我将不胜感激。
Thanks, Nick
谢谢，尼克
回答by Praveen Kumar Purushothaman
In your site, you have both prototype.jsand jQueryadded. The $here calls prototype.jsinstead of jQuery. So instead of that code, please change it to:
在您的站点中，您同时拥有prototype.js和jQuery添加。在$这里呼吁prototype.js的，而不是jQuery。因此，请不要使用该代码，而是将其更改为：
jQuery('.addtocart').on('click', function(){
//get the value of the "data-value" attribute for that link
var vehicleRegistration = jQuery(this).data('value');
//save it to localStorage
localStorage.setItem('vehicleRegistration', vehicleRegistration);
//read from localStorage
if( localStorage.getItem('vehicleRegistration') ){
//add the value to the form input
jQuery('#field34').val( localStorage.getItem('vehicleRegistration') );
}
});
Or you can also do this:
或者你也可以这样做：
(function ($) {
$('.addtocart').on('click', function(){
//get the value of the "data-value" attribute for that link
var vehicleRegistration = $(this).data('value');
//save it to localStorage
localStorage.setItem('vehicleRegistration', vehicleRegistration);
//read from localStorage
if( localStorage.getItem('vehicleRegistration') ){
//add the value to the form input
$('#field34').val( localStorage.getItem('vehicleRegistration') );
}
});
})(jQuery);
回答by Laxmikant Dange
The problem is with $. Your $ is getting conflict with jQuery and prototypejs.
问题在于$. 您的 $ 与 jQuery 和prototypejs 发生冲突。
Whenever you write jQuery code, try using self invocation function with jQuery as parameter.
每当您编写 jQuery 代码时，请尝试使用以 jQuery 作为参数的自调用函数。
for Ex.
对于前。
(function($){//You can use any character instead $ here.
//Your code here to use $.
})(jQuery);
or another way is use jQueryword instead of $.
或另一种方法是使用jQueryword 而不是$.
for Ex.
对于前。
jQuery('.addtocart').on('click', function(){
//Your code here.
});
In your code, $is used by prototype, $('.addtocart')is returning null as there are no elements with class .addtocart when this script gets executed. and thats why it is throwing error while accessing on of null*($('.addtocart'))*.
在您的代码中，$由原型使用，$('.addtocart')返回 null，因为在执行此脚本时没有类 .addtocart 的元素。这就是为什么它在访问 null*($('.addtocart'))* 时抛出错误的原因。
If you want to add eventhandler with jquery Only. then use jQuery word instead $.
如果您想仅使用 jquery 添加事件处理程序。然后使用 jQuery 词代替 $.
//when add to cart link is clicked...
jQuery('.addtocart').on('click', function(){
//get the value of the "data-value" attribute for that link
var vehicleRegistration = jQuery(this).data('value');
//save it to localStorage
localStorage.setItem('vehicleRegistration', vehicleRegistration);
//read from localStorage
if( localStorage.getItem('vehicleRegistration') ){
//add the value to the form input
jQuery('#field34').val( localStorage.getItem('vehicleRegistration') );
}
});
