Question

我有现有代码：

 <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;?> &nbsp;&nbsp;<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>

我还希望在点击更改时将焦点设置到输入框。目前它只是在点击更改时显示/隐藏。

谢谢！

Answer 1

正如其中一个答案所示，点击处理程序不引人注目。使用以下代码聚焦文本框。

$(function(){
    $("id^=show_name a").click(function(){
        $('edit_name').show(); 
        $('show_name').hide(); 
        $("#name").focus();
        return false;
    });
});

您的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;?> &nbsp;&nbsp;<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>

Answer 2

您可以使用：

$("#inputid").focus();

如果将其添加到处理表单显示的事件中（或将其添加到文档就绪函数，例如

$(function(){
  $("#inputid").focus();
});

）它也适用于页面加载。

将焦点设置为输入框

2 个答案: