Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery .addClass to set up another function using new class
    text
    copied!<p>I'm working on a drawing app and running into some trouble with the use of .addClass. What I'm trying to do is send a new class to a menu item that I can then use to run a function which clears my canvas. I can make the list item invoke the function on its own when the class is preset to 'new_file', but I would like to have it inactive until some drawing is done on the canvas. My idea was to use .addClass when a mousedown is detected on the canvas, but it's not working out as planned. Other ideas for how to accomplish this are encouraged as well. Here's some code:</p> <p>This code from my canvas.js file clears the canvas when the list item with class 'new_file' is clicked.</p> <pre><code> $(document).ready(function(){ $('.new_file').mousedown(function(){ clearCanvas(); }); function clearCanvas(){ context.clearRect(0, 0, canvas.width(), canvas.height()); } }); </code></pre> <p>This is what I tried for adding the class; it's in my 'head' for now:</p> <pre><code> &lt;script&gt; $(document).ready(function(){ $("#myCanvas").click(function() { //tried .mousedown; did nothing $("#clear").addClass("new_file"); }); }); &lt;/script&gt; </code></pre> <p>This is the list item I'm trying to manipulate:</p> <pre><code> &lt;li id="clear"&gt;Clear&lt;/li&gt; </code></pre> <p>And my canvas:</p> <pre><code> &lt;canvas class="canvaso" id="myCanvas" height="239" width="414"&gt;&lt;/canvas&gt; &lt;script type="text/javascript" src="canvas.js"&gt;&lt;/script&gt; </code></pre> <p>I tried testing various edits while observing firebug but it seems like "new_file" isn't being added to the list item. Also tried changing #myCanvas and testing other IDs on the page but still couldn't get new_file added. Stumped.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload