diff options
author | Justin Meyer <justinbmeyer@gmail.com> | 2009-12-04 11:28:50 -0500 |
---|---|---|
committer | jeresig <jeresig@gmail.com> | 2009-12-04 11:28:50 -0500 |
commit | d42afd0f657d12d6daba6894d40226bea83fe1b6 (patch) | |
tree | 242ceb87da56506dc09744eb0196f1f60edc926a /test/delegatetest.html | |
parent | c6a0211e57cfc8da15f7993e71e27256aefc7f65 (diff) | |
download | jquery-d42afd0f657d12d6daba6894d40226bea83fe1b6.tar.gz jquery-d42afd0f657d12d6daba6894d40226bea83fe1b6.zip |
Adding in support for bubbling submit and change events, thanks to the patch by Justin Meyer. Includes a delegation test suite for manually testing to see if the events work as intended.
Diffstat (limited to 'test/delegatetest.html')
-rw-r--r-- | test/delegatetest.html | 123 |
1 files changed, 123 insertions, 0 deletions
diff --git a/test/delegatetest.html b/test/delegatetest.html new file mode 100644 index 000000000..c580b290e --- /dev/null +++ b/test/delegatetest.html @@ -0,0 +1,123 @@ +<html>
+ <head>
+ <script src='../dist/jquery.js' type='text/javascript'></script>
+ <style>
+ .red {
+ background-color: red;
+ border: solid 3px red;
+ }
+ </style>
+ </head>
+ <body>
+ <h2>Change Tests</h2>
+ <table>
+ <tr>
+ <td>
+ Change each:
+ </td>
+ <td>
+ <select class='select_test'>
+ <option value='one'>change me 1</option>
+ <option value='two'>change me 2</option>
+ <option value='three'>change me 3</option>
+ </select>
+ </td>
+ <td>
+ <select class='mselect_test' multiple="multiple">
+ <option value='one'>change me 1</option>
+ <option value='two'>change me 2</option>
+ <option value='three'>change me 3</option>
+ </select>
+ </td>
+ <td>
+ <input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox1"/>
+ <label for="checkbox1">Checkbox 1 label</label><br/>
+ <input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox2"/>
+ <label for="checkbox2">Checkbox 2 label</label>
+ </td>
+ <td>
+ <input type="radio" class="radio_test" name="myradio" id="radio1"/>
+ <label for="radio1">Radio 1 label</label><br/>
+ <input type="radio" class="radio_test" name="myradio" id="radio2"/>
+ <label for="radio2">Radio 2 label</label>
+ </td>
+ <td>
+ <input class='test' value='' id='input' size='10' />
+ </td>
+ <td>
+ <textarea rows='2'></textarea>
+ </td>
+ <td>$().bind('change')</td>
+ </tr>
+ <tr>
+ <td>Results:</td>
+ <td id='select' class="red">SELECT</td>
+ <td id='mselect' class="red">MULTI</td>
+ <td id='checkbox' class="red">CHECKBOX</td>
+ <td id='radio' class="red">RADIO</td>
+ <td id='text' class="red">TEXT</td>
+ <td id='textarea' class="red">TEXTAREA</td>
+ <td id='boundChange' class="red">DOCUMENT</td>
+ </tr>
+ </table>
+ <h2>Submit Tests</h2>
+ <table>
+ <tr>
+ <td>
+ Submit each:
+ </td>
+ <td>
+ <form action="" id="text_submit">
+ <input class='test' type='text' value='Key Return To Submit'/>
+ </form>
+ </td>
+ <td>
+ <form action="" id="password_submit">
+ <input class='test' type='password' value=''/>
+ </form>
+ </td>
+ <td>
+ <form action="" id="submit_submit">
+ <input type='submit' value="Click Me To Submit" />
+ </form>
+ </td>
+ <td>$().bind('submit')</td>
+ </tr>
+ <tr>
+ <td>Results:</td>
+ <td id='textSubmit' class="red">TEXT</td>
+ <td id='passwordSubmit' class="red">PASSWORD</td>
+ <td id='submitSubmit' class="red">BUTTON</td>
+ <td id='boundSubmit' class="red">DOCUMENT</td>
+ </tr>
+ </table>
+
+
+ <script type='text/javascript'>
+ makeChangeFunc = function(id, prevent){
+ return function(e){
+ if(prevent)
+ e.preventDefault();
+ $(id).css("backgroundColor","green").css("border","solid 3px green");
+ setTimeout(function(){
+ $(id).css("backgroundColor","");
+ }, 700)
+ }
+ }
+
+ $(".select_test").live("change",makeChangeFunc("#select"))
+ $(".mselect_test").live("change",makeChangeFunc("#mselect"))
+ $(".checkbox_test").live("change",makeChangeFunc("#checkbox"))
+ $(".radio_test").live("change",makeChangeFunc("#radio"))
+ $('textarea').live('change', makeChangeFunc("#textarea"))
+ $('#input').live('change', makeChangeFunc("#text"))
+ $().bind('change', makeChangeFunc("#boundChange"))
+
+ $("#text_submit").live("submit", makeChangeFunc("#textSubmit", true) )
+ $("#password_submit").live("submit", makeChangeFunc("#passwordSubmit", true) )
+ $("#submit_submit").live("submit", makeChangeFunc("#submitSubmit", true) )
+ $().bind('submit', makeChangeFunc("#boundSubmit"))
+
+ </script>
+ </body>
+</html>
|