JQuery onblur with Google Apps Script

I am trying to get jQuery onblur to work in the Google Apps Script HtmlService. I can get HTML for rendering and everything, but onblur is not working. I just make it simple to get it working first, put the input text and change the background color of the div.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $('#color').blur(function(){
    $('#container').css('background-color','#ffffff');
  });
});
</script>

<label>Background Color: </label><input type="text" size="30" id="color" name="color" /><br />

<div id="container" style="background-color:#9fc1f1;">
test
</div>
+1
source share
1 answer

This works for me well. Here is the expanded version (I changed the color of the change to blue for greater significance) -

https://script.google.com/macros/s/AKfycbykzYO1_z5Zp0g5Nx1F5aLa10JVIbN8nQGSWskBQdzypLRRnklw/exec

Here is my full script. I noticed that this did not work if I did not have the environment <html>. Have you included this in your script?

<html>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $('#color').blur(function(){
    $('#container').css('background-color','#000fff');
  });
});
</script>
<label>Background Color: </label><input type="text" size="30" id="color" name="color" /><br/>
<div id="container" style="background-color:#9fc1f1;">
test
</div>
</html>
+1
source

All Articles