Question

在按钮点击事件中，我想重定向到页面的特定部分（在我的情况下是一个表单），并在该部分放置focus。

我如何实现这一重点？

<button class="btn btn-primary" id="addNewRequest" onclick="window.location='<?php echo Utility::getBaseUrl();?>leave/request/#addEmergencyLeave'">Add New Request</button>

这是我想要指向并关注的表单

<div>
<form id="addEmergencyLeave" method="POST" action="<?php echo Utility::getBaseUrl();?>addEmergencyLeave">
    <select name="user_id" class="select2-container form-control" id="employee_list">
        <option></option>
        <option></option>

    </select>
    <select id="EmergencyLeaveType" class="select2-container form-control" name="EmergencyLeaveType">
        <option></option>
        <option value="2">Personal Leave</option>
        <option value="1">Sick Leave</option>
        <option value="6">Substitute/Others Leave</option>
        <option value="7">Special Leave</option>
    </select>

    <select name="emergency_leave_length" class="select2-container form-control" id="emergency_leave_length">
        <option></option>
        <option value="0">Full Day</option>
        <option value="1">First Half</option>
        <option value="2">Second Half</option>   
    </select>

    <div class="form-group">
        <button class="btn btn-default" type="submit" value="" name="EmergencyLeaveSubmit">Submit and Approve Leave</button>
    </div>
</form>
</div>

我已设法重定向到特定的#addEmergencyLeave部分但无法关注它。

非常感谢任何帮助。感谢。

Answer 1

当你说一个表格时，你的意思是什么？如果您想首先选择表单，请在 href 中使用 #employee_list 。

另一种方法是在你的选择中使用自动对焦属性，但我认为这并不是你想要的。

Answer 2

您无法对表单进行聚焦，只能对表单元素进行聚焦，而且通常使用javascript来实现。将此代码添加到HTML中（在结束</body>元素之前），它将检查散列#addEmergencyLeave是否在URL中，并且在这种情况下，它将关注表单的第一个元素：

<script>
    function onload() {
        if (location.href.indexOf('#addEmergencyLeave') != -1) {
            document.getElementById('employee_list').focus();
        }
    }

    window.addEventListener('load', onload, false);
</script>

addEventListener是在javascript上添加事件监听器的正确方法，这里是load元素上的window事件，通常如果你使用jQuery，你会更喜欢文档就绪事件，这种事件更快。

在php中重定向后关注页面的特定部分

2 个答案: