无需点击即可将输入值传递给其他输入

Question

我有一个工作代码可以将值从一个 id 传递到另一个 id，但要做到这一点，我需要一个按钮来传递它 onclick。我想在没有按钮的情况下将值直接传递给其他输入。当我做我的研究时，我刚刚看到了 onclick 解决方案.. 还有其他方法还是我坚持使用此选项

我的代码：

window.onload = function() {
    document.getElementById('button').onclick = function() {
        document.getElementById('email2').value = document.getElementById('email').value;
        document.getElementById('firma2').value = document.getElementById('firma').value;
        document.getElementById('name2').value = document.getElementById('name').value;
        document.getElementById('nummer2').value = document.getElementById('nummer').value;

    }
};

Answer 1

试试这个解决方案：

const textInput = document.querySelector('#text');
const checkboxInputs = document.querySelectorAll('[id^=checkbox]');
const secondInput = document.querySelector('#second');
const thirdInput = document.querySelector('#third');

textInput.addEventListener('input', (e) => {
  secondInput.value = e.target.value;
})

textInput.addEventListener('change', (e) => {
  thirdInput.value = e.target.value;
})

const checkboxesSet = new Set();

checkboxInputs.forEach(checkboxInput =>
  checkboxInput.addEventListener('change', (e) => {
    const label = document.querySelector(`label[for=${e.target.id}]`).innerText;
    
    checkboxesSet[e.target.checked ? 'add' : 'delete'](label);
    
    const text = [...checkboxesSet].join(', ');

    secondInput.value = text;
    thirdInput.value = text;
  })
)

<label for="text">Text input</label>
<input id="text">
<br/>
<label for="checkbox1">Checkbox input 1</label>
<input id="checkbox1" type="checkbox">
<br/>
<label for="checkbox2">Checkbox input 2</label>
<input id="checkbox2" type="checkbox">
<br/>
<label for="second">While typing</label>
<input id="second">
<br/>
<label for="third">At the end</label>
<input id="third">

Answer 2

您可以考虑使用 onchange 而不是 onclick。

无需点击即可将输入值传递给其他输入

Pass value of input to other input without onclick

javascript

onclick

onload