Javascript: Как использовать одну и ту же кнопку для другого ввода текста? - PullRequest
2 голосов
/ 10 мая 2011

Предположим, у меня есть 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>

Есть идеи? Большое спасибо.

Ответы [ 4 ]

2 голосов
/ 10 мая 2011

В ту минуту, когда вы нажимаете кнопку, текстовое поле теряет фокус в любом случае.Попробуйте перехватить метод OnFocus для каждого текстового поля и установите переменную для экземпляра текстового поля.Таким образом, у вас есть последнее текстовое поле, и вам не нужно выражение if.

1 голос
/ 10 мая 2011

Если у входа есть фокус, и если пользователь затем нажимает кнопку, вход мгновенно теряет фокус, поэтому вы не можете определить, какой вход имеет фокус по вашему желанию.

Вы можете создать переменную, которая хранит«текущий» вход путем присоединения обработчика события к каждому входу для события 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);
0 голосов
/ 10 мая 2011

Один трюк - объявить переменную и установить ее в onFocus событии каждого поля.Затем в коде кнопки вы можете проверить, какое поле было последним, перед тем как нажать кнопку.

0 голосов
/ 10 мая 2011

Я бы порекомендовал попробовать обработчик событий onFocus.

...