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

On Thu, 10 Sep 2009 13:17:37 +0200, <whatwg at whatwg.org> wrote:

> 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: 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>&lt;form action="calcSquare.php">
> + &lt;p>
> +  &lt;label for=x>Number&lt;/label>:
> +  &lt;input id="x" name="x" type="number">
> + &lt;/p>
> + &lt;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;
> +  };
> + &lt;/script>
> + &lt;noscript>
> +  &lt;input type=submit value="Calculate Square">
> + &lt;/noscript>
> +&lt;/form></pre>
> +
> +   <p>When script is enabled,

disabled.


> 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>

Please add another example showing how to do the same thing without  
<noscript> (i.e. swapping the submit button for the output paragraph  
replaceChild). This is a better technique because <noscript> is unaware of  
whether the script was successful, and also <noscript> is not supported in  
XHTML.

-- 
Simon Pieters
Opera Software

Received on Thursday, 10 September 2009 04:39:23 UTC