JavaScript Tutorial/jQuery/focus
Содержание
Fire focus event
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function () {
$(this).next("span").css("color","red");
});
});
</script>
</head>
<body>
<body>
<p><input type="text" /> <span>focus event fire</span></p>
</body>
</html>
Set focus form field
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").removeAttr("disabled").focus().val("editable now");
});
</script>
</head>
<body>
<body>
<button>Enable</button>
<input type="text" disabled="disabled" value="data"/>
</body>
</html>
Set focus to text box
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus();
});
</script>
</head>
<body>
<body>
<p><input type="text" /> <span>focus event fire</span></p>
</body>
</html>
To focus on a login input box with id "login" on page startup
$(document).ready(function(){
$("#login").focus();
});
Trigger focus event
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#old").click(function(){
$("input").trigger("focus");
});
$("#new").click(function(){
$("input").triggerHandler("focus");
});
$("input").focus(function(){
$("<span>Focused!</span>").appendTo("body");
});
});
</script>
</head>
<body>
<body>
<button id="old">.trigger("focus")</button>
<button id="new">.triggerHandler("focus")</button><br/><br/>
<input type="text" value="To Be Focused"/>
</body>
</html>