selectionStartEnd.htm (2227B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title id="desc">HTML5 Selection: Set selectionStart and selectionEnd on a text field</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="common.js"></script> 8 <script type="text/javascript"> 9 function RunTest() 10 { 11 var selection = window.getSelection(); 12 var input1 = document.getElementById("input1"); 13 14 assert_equals(input1.selectionStart, 0); 15 assert_equals(input1.selectionEnd, 0); 16 checkDefaultSelectionAttributes(); 17 assert_equals(selection.toString(), ""); 18 19 // only setting selectionStart/End doesn't affect getSelection() 20 21 input1.selectionStart = 5; 22 input1.selectionEnd = 9; 23 24 assert_equals(input1.selectionStart, 5); 25 assert_equals(input1.selectionEnd, 9); 26 checkDefaultSelectionAttributes(); 27 assert_equals(selection.toString(), ""); 28 29 // select() changes selectionStart/End and getSelection() 30 31 input1.select(); 32 33 assert_equals(input1.selectionStart, 0); 34 assert_equals(input1.selectionEnd, input1.value.length); 35 checkSelectionAttributes(document.body, 1, document.body, 1, true, 1); 36 assert_equals(selection.toString(), input1.value); 37 38 // now setting selectionStart/End does affect getSelection() 39 40 input1.selectionStart = 5; 41 input1.selectionEnd = 9; 42 43 assert_equals(input1.selectionStart, 5); 44 assert_equals(input1.selectionEnd, 9); 45 checkSelectionAttributes(document.body, 1, document.body, 1, true, 1); 46 assert_equals(selection.toString(), "text"); 47 } 48 </script> 49 </head> 50 <body onload="test(RunTest);"> 51 <input style="WIDTH: 500px" id="input1" value="Some text in an input control" type="text" /> 52 <p>Select some text in the input element by setting selectionStart and selectionEnd</p> 53 </body> 54 </html>