[html5] r3793 - [e] (0) <noscript> example

[whatwg at whatwg.org]

Author: ianh
Date: 2009-09-10 04:17:36 -0700 (Thu, 10 Sep 2009)
New Revision: 3793

Modified:
   index
   source
Log:
[e] (0) <noscript> example

Modified: index
===================================================================
--- index	2009-09-10 09:59:24 UTC (rev 3792)
+++ index	2009-09-10 11:17:36 UTC (rev 3793)
@@ -12613,8 +12613,40 @@
 
   </div>
 
+  <div class=example>
 
+   <p>In the following example, a <code><a href=#the-noscript-element>noscript</a></code> element is
+   used to provide fallback for a script.</p>
 
+   <pre><form action="calcSquare.php">
+ <p>
+  <label for=x>Number</label>:
+  <input id="x" name="x" type="number">
+ </p>
+ <script>
+  var x = document.getElementById('x');
+  var output = document.createElement('p');
+  output.textContent = 'Type a number; it will be squared right then!';
+  x.form.appendChild(output);
+  x.form.onsubmit = function () { return false; }
+  x.oninput = function () {
+    var v = x.valueAsNumber;
+    output.textContent = v + ' squared is ' + v * v;
+  };
+ </script>
+ <noscript>
+  <input type=submit value="Calculate Square">
+ </noscript>
+</form></pre>
+
+   <p>When script is enabled, a button appears to do the calculation
+   on the server side. When script is enabled, the value is computed
+   on-the-fly instead.</p>
+
+  </div>
+
+
+
   <h3 id=sections><span class=secno>4.4 </span>Sections</h3>
 
   <h4 id=the-body-element-0><span class=secno>4.4.1 </span>The <dfn><code>body</code></dfn> element</h4>

Modified: source
===================================================================
--- source	2009-09-10 09:59:24 UTC (rev 3792)
+++ source	2009-09-10 11:17:36 UTC (rev 3793)
@@ -13454,8 +13454,40 @@
 
   </div>
 
+  <div class="example">
 
+   <p>In the following example, a <code>noscript</code> element is
+   used to provide fallback for a script.</p>
 
+   <pre><form action="calcSquare.php">
+ <p>
+  <label for=x>Number</label>:
+  <input id="x" name="x" type="number">
+ </p>
+ <script>
+  var x = document.getElementById('x');
+  var output = document.createElement('p');
+  output.textContent = 'Type a number; it will be squared right then!';
+  x.form.appendChild(output);
+  x.form.onsubmit = function () { return false; }
+  x.oninput = function () {
+    var v = x.valueAsNumber;
+    output.textContent = v + ' squared is ' + v * v;
+  };
+ </script>
+ <noscript>
+  <input type=submit value="Calculate Square">
+ </noscript>
+</form></pre>
+
+   <p>When script is enabled, a button appears to do the calculation
+   on the server side. When script is enabled, the value is computed
+   on-the-fly instead.</p>
+
+  </div>
+
+
+
   <h3>Sections</h3>
 
   <h4>The <dfn><code>body</code></dfn> element</h4>