Question

我写了一个包含一些内容的网页。在那里，我需要在点击一个按钮后创建一个输入文本框，但由于现有的东西它将位于底部，我无法看到输入框，因为它在可见区域之外。我在那里向下滚动找到那个。我试着用焦点方法，它专注于输入框，它无法将输入框带到可见区域。在顶部，我有一些javascript的东西。所以我需要这样做而没有refresh.Here是我试过的代码片段。

<script>

function create(){
var inputBox=document.createElement('input');
inputBox.setAttribute('id','myInput');
var body=document.getElementsByTagName('body')[0]; 
body.appendChild(inputBox);
document.getElementById('myInput').focus();
}
</script>

<body>

<button onclick="create()">Click me</button>


</body>

任何人都可以帮助我！

Answer 1

是的，您将文本输入作为正文中的最后一个元素插入。如果您希望它出现在特定位置，请为其创建占位符。例如：

<script>

function create(){
var inputBox=document.createElement('input');
inputBox.setAttribute('id','myInput');

var wrapper=document.getElementById('wrapper'); 
wrapper.appendChild(inputBox);

inputBox.focus();
}
</script>

<body>

<button onclick="create()">Click me</button>
<div id="wrapper"></div>


</body>

Answer 2

你需要一个anker：

<a name="button"></a>
<button onclick="create()">Click me</button>

然后你可以跳到它

location.href = 'http://yourpage#button'

如果你跳到同一页面上的anker，页面将不会重新加载。

Answer 3

您可以随时在HTML标记中输入，并在单击按钮时使其可见。

同时更换

body.appendChild

带

body.insertBefore(inputBox,body.firstChild);

应该做你想做的事。

无需在javascript中重新加载页面即可定位到div

3 个答案: