Question

假设我有2个输入元素，只有1个按钮。我希望按钮一次为一个输入元素执行一个函数，根据哪个当前正在聚焦，但我不知道如何捕获每个元素的聚焦状态。

请考虑这个例子：

<head>
<script type="text/javascript">
var id_box = document.createElement('input');
id_box.id = 'id_box';
id_box.type = 'text';
div.appendChild(id_box);

var weight_box = document.createElement('input');
weight_box.id = 'weight_box';
weight_box.type = 'text';
div.appendChild(weight_box);

function showLetter() {
    if (id_box is being focused){
        document.getElementById('id_box').value = 'ABC';
    }
    if (weight_box is being focused){
        document.getElementById('weight_box').value = 'ABC';
    }
}
</script>
</head>

<body>
    <button onclick="showLetter()">ABC</button>
</body>

有什么想法吗？非常感谢你。

Answer 1

单击按钮的那一刻，文本字段无论如何都会失去焦点。尝试捕获每个文本框的OnFocus方法，并将变量设置为文本字段的实例。这样您就拥有了最新的文本字段，并且不需要if语句。

Answer 2

如果输入具有焦点，并且如果用户然后单击按钮，则输入将立即失去焦点，因此您无法以您希望的方式检测哪个输入具有焦点。

您可以通过将事件处理程序附加到onFocus事件的每个输入来创建存储“当前”输入的变量。

演示jsFiddle：http://jsfiddle.net/P58sx/1/

var current_input;

function showLetter() {
  current_input.value = 'ABC';
}

function setCurrentInput() {
  console.log(this);
  current_input = this;
}

var id_box = document.createElement('input');
id_box.id = 'id_box';
id_box.type = 'text';
id_box.addEventListener("focus", setCurrentInput);
div.appendChild(id_box);

var weight_box = document.createElement('input');
weight_box.id = 'weight_box';
weight_box.type = 'text';
weight_box.addEventListener("focus", setCurrentInput);
div.appendChild(weight_box);

Answer 3

我建议您尝试使用onFocus事件处理程序。

Answer 4

一个技巧是声明一个变量并在每个字段的onFocus事件中设置它。然后在按钮代码中，您可以检查在单击按钮之前最后聚焦的字段是什么。

Javascript：如何使用相同的按钮进行不同的文本输入？

4 个答案: