javascript - jQuery: object is not a function -
i've been trying toggle 2 .pngs on button click. when run code, console throws error: uncaught typeerror: object not function. here code:
<body> <h1>my website</h1> <div> <button data-file="bs">bmw </button> <button data-file ="ms">mercedes</button> </div> <div id="bmw"> <img src="bmw.png"> </div> <div id="mercedes"> <img src="merc.png"> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script> (function () { var link = $('link'); $('button').click(function () { var $this = $(this) car = $(this).data('file'); console.log(car); link.attr('href', car + '.png'); }); })(); </script> which object referring to? , how alter code?
thanks in advance!
$('link') invalid. there no html tag called 'link'. might want is
<button data-image-id='bmw'>bmw</button> <button data-image-id='merc'>mercedes</button> <img src='bmw.png' id='bmw' /> <img src='merc.png' id='merc' /> (function() { $('button').click(function() { var button = $(this); var imageid = button.data('image-id'); var image = $('img#' + imageid); image.toggle(); }); })(); when button clicked, gets button's data-image-id, finds image id , toggle image.
Comments
Post a Comment