Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

276 lines (259 sloc) 9.249 kb
<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>
<select class='select_test'>
<option value='one'>change me 1</option>
<option value='two' selected="selected">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><br/>
<input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox2"/>
<label for="checkbox2">Checkbox 2</label><br />
<input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox3" disabled="disabled"/>
<label for="checkbox3">Checkbox 3</label>
</td>
<td>
<button class="button_test" name="mybutton1" id="button1">Button</button><br />
<button class="button_test" name="mybutton1" id="button1"><span>Button w/ child</span></button><br />
<button class="button_test" name="mybutton1" id="button1" disabled="disabled">Button Disabled</button><br />
<button class="button_test" name="mybutton1" id="button1" disabled="disabled"><span disabled="disabled">Button w/ child Dis.</span></button><br />
</td>
<td>
<input type="radio" class="radio_test" name="myradio" id="radio1"/>
<label for="radio1">Radio1</label><br/>
<input type="radio" class="radio_test" name="myradio" id="radio2"/>
<label for="radio2">Radio2</label><br />
<input type="radio" class="radio_test" name="myradio" id="radio3" disabled="disabled"/>
<label for="radio3">Radio3</label>
</td>
<td>
<input class="file_test" id="file1" type="file"/>
<td>
<input class='test' value='' id='input' size='10' />
<input class='test' value='test' id='input2' size='10' readonly="readonly" />
</td>
<td>
<textarea rows='2'></textarea>
</td>
</td>
<td>$(document).bind('change')<br />
$(document).bind('click')
</td>
</tr>
<tr>
<td>Live:</td>
<td id='select' class="red">SELECT</td>
<td id='mselect' class="red">MULTI</td>
<td id='checkbox' class="red">CHECKBOX</td>
<td id='button' class="red">BUTTON</td>
<td id='radio' class="red">RADIO</td>
<td id='file' class="red">FILE</td>
<td id='text' class="red">TEXT</td>
<td id='textarea' class="red">TEXTAREA</td>
<td id='boundChange' class="red">DOCUMENT</td>
</tr>
<tr>
<td>Bind:</td>
<td id='selectbind' class="red">SELECT</td>
<td id='mselectbind' class="red">MULTI</td>
<td id='checkboxbind' class="red">CHECKBOX</td>
<td id='buttonbind' class="red">BUTTON</td>
<td id='radiobind' class="red">RADIO</td>
<td id='filebind' class="red">FILE</td>
<td id='textbind' class="red">TEXT</td>
<td id='textareabind' class="red">TEXTAREA</td>
</tr>
<tr>
<td>Focusin:</td>
<td id='selectfocus' class="red">SELECT</td>
<td id='mselectfocus' class="red">MULTI</td>
<td id='checkboxfocus' class="red">CHECKBOX</td>
<td id='buttonfocus' class="red">BUTTON</td>
<td id='radiofocus' class="red">RADIO</td>
<td id='filefocus' class="red">FILE</td>
<td id='textfocus' class="red">TEXT</td>
<td id='textareafocus' class="red">TEXTAREA</td>
<td id='boundFocus' class="red">DOCUMENT</td>
</tr>
<tr>
<td>Focusout:</td>
<td id='selectblur' class="red">SELECT</td>
<td id='mselectblur' class="red">MULTI</td>
<td id='checkboxblur' class="red">CHECKBOX</td>
<td id='buttonblur' class="red">BUTTON</td>
<td id='radioblur' class="red">RADIO</td>
<td id='fileblur' class="red">FILE</td>
<td id='textblur' class="red">TEXT</td>
<td id='textareablur' class="red">TEXTAREA</td>
<td id='boundBlur' class="red">DOCUMENT</td>
</tr>
<tr>
<td>Live Focus:</td>
<td id='selectlfocus' class="red">SELECT</td>
<td id='mselectlfocus' class="red">MULTI</td>
<td id='checkboxlfocus' class="red">CHECKBOX</td>
<td id='buttonlfocus' class="red">BUTTON</td>
<td id='radiolfocus' class="red">RADIO</td>
<td id='filelfocus' class="red">FILE</td>
<td id='textlfocus' class="red">TEXT</td>
<td id='textarealfocus' class="red">TEXTAREA</td>
</tr>
<tr>
<td>Live Blur:</td>
<td id='selectlblur' class="red">SELECT</td>
<td id='mselectlblur' class="red">MULTI</td>
<td id='checkboxlblur' class="red">CHECKBOX</td>
<td id='buttonlblur' class="red">BUTTON</td>
<td id='radiolblur' class="red">RADIO</td>
<td id='filelblur' class="red">FILE</td>
<td id='textlblur' class="red">TEXT</td>
<td id='textarealblur' class="red">TEXTAREA</td>
</tr>
<tr>
<td>Live Click:</td>
<td id='selectlclick' class="red">SELECT</td>
<td id='mselectlclick' class="red">MULTI</td>
<td id='checkboxlclick' class="red">CHECKBOX</td>
<td id='buttonlclick' class="red">BUTTON</td>
<td id='radiolclick' class="red">RADIO</td>
<td id='filelclick' class="red">FILE</td>
<td id='textlclick' class="red">TEXT</td>
<td id='textarealclick' class="red">TEXTAREA</td>
<td id='boundClick' 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>$(document).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>
<ul id="log"></ul>
<script type='text/javascript'>
jQuery.fn.addChangeClickTest = function( id, prevent ) {
this.bind("focusin", function(){
jQuery(id + "focus").blink();
}).bind("focusout", function(){
jQuery(id + "blur").blink();
});
this.bind("focus", function(){
jQuery(id + "lfocus").blink();
}).bind("blur", function(){
jQuery(id + "lblur").blink();
});
return this.bind("change", function(e){
jQuery(id + "bind").blink();
}).live("change", function(e){
if ( prevent ) {
e.preventDefault();
}
jQuery(id).blink();
}).live("click", function(e){
jQuery(id + "lclick").blink();
});
};
jQuery.fn.addSubmitTest = function( id, prevent ) {
return this.live("submit", function(e){
if ( prevent ) {
e.preventDefault();
}
jQuery(id).blink();
});
};
jQuery.fn.blink = function(){
return this.css("backgroundColor","green").css("border","solid 3px green").delay(700).queue(function(next){
jQuery(this).css("backgroundColor","");
next();
});
};
$(document).bind("focusin", function() {
jQuery("#boundFocus").blink();
});
$(document).bind("focusout", function() {
jQuery("#boundBlur").blink();
});
$(document).bind("click", function() {
jQuery("#boundClick").blink();
});
$("td.red").live("hover", function(e) {
if ( e.type === "mouseenter" ) {
$(this).css("backgroundColor","green");
} else {
$(this).css("backgroundColor","");
}
});
$(".select_test").addChangeClickTest("#select");
$(".mselect_test").addChangeClickTest("#mselect");
$(".checkbox_test").addChangeClickTest("#checkbox");
$(".radio_test").addChangeClickTest("#radio");
$(".file_test").addChangeClickTest("#file");
$('textarea').addChangeClickTest("#textarea");
$('#input').addChangeClickTest("#text");
$('button').addChangeClickTest("#button");
$(document).bind("change", function(){
jQuery("#boundChange").blink();
});
$("#text_submit").addSubmitTest("#textSubmit", true);
$("#password_submit").addSubmitTest("#passwordSubmit", true);
$("#submit_submit").addSubmitTest("#submitSubmit", true);
$(document).bind("submit", function(){
jQuery("#boundSubmit").blink();
});
</script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.