Javascript 将焦点设置到输入框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5636201/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
set focus to input box
提问by Mike
I have the existing code:
我有现有的代码：
<form action="page.php?id=<?= $_GET['id'] ?>" method="post">
<fieldset>
<p id="edit_name"><label for="name">Page Name:</label><input type="text" name="name" value="<?PHP echo htmlspecialchars_decode($s->name);?>" id="name"> <input type="submit" src="../img/button_save.jpg" name="btnSubmit" value="Save" id="btnSubmit" class="submit"></p>
<div id="show_name"<?= $_GET['edit'] ? ' style=" display: none"' : '' ?>><p><label for="name">Page Name:</label> <?PHP echo $s->name;?> <a href="?id=<?= $_GET['id'] ?>&edit_name=1" onClick="$('edit_name').show(); $('show_name').hide(); return false;"><img style="vertical-align: top;" src="../img/button_change.png" alt="Change Name"></a></p></div>
<?
// for non-JS browsers
if(!$_GET['edit']) {
?>
<script type="text/javascript">
$('edit_name').hide();
</script>
<?
}
?>
</fieldset>
</form>
I want to also set focus to the input box on clicking change. Currently it just shows/hides upon clicking change.
我还想在单击更改时将焦点设置到输入框。目前它只是在点击更改时显示/隐藏。
Thanks!
谢谢！
采纳答案by Chandu
As suggested in one of the answers make the click handler unobstrusive. Use the following code to focus the text box.
正如其中一个答案所建议的那样，点击处理程序不会引人注目。使用以下代码来聚焦文本框。
$(function(){
$("id^=show_name a").click(function(){
$('edit_name').show();
$('show_name').hide();
$("#name").focus();
return false;
});
});
Your HTML/PHP should now look like below:
您的 HTML/PHP 现在应如下所示：
<form action="page.php?id=<?= $_GET['id'] ?>" method="post">
<fieldset>
<p id="edit_name"><label for="name">Page Name:</label><input type="text" name="name" value="<?PHP echo htmlspecialchars_decode($s->name);?>" id="name"> <input type="submit" src="../img/button_save.jpg" name="btnSubmit" value="Save" id="btnSubmit" class="submit"></p>
<div id="show_name"<?= $_GET['edit'] ? ' style=" display: none"' : '' ?>><p><label for="name">Page Name:</label> <?PHP echo $s->name;?> <a href="?id=<?= $_GET['id'] ?>&edit_name=1"><img style="vertical-align: top;" src="../img/button_change.png" alt="Change Name"></a></p></div>
<?
// for non-JS browsers
if(!$_GET['edit']) {
?>
<script type="text/javascript">
$('edit_name').hide();
</script>
<?
}
?>
</fieldset>
</form>
回答by Alex
You can use:
您可以使用：
$("#inputid").focus();
If you add that to the event that handles the displaying of the form (or add it to a document ready function such as
如果您将其添加到处理表单显示的事件中（或将其添加到文档就绪功能中，例如
$(function(){
$("#inputid").focus();
});
) it will also work on page load instead.
) 它也适用于页面加载。
