将用户 HTML 输入作为 javascript 函数参数传递

Question

我有这行 javascript：

stave.addClef("treble").addTimeSignature("4/4");

根据用户在 HTML 文档中输入的内容，我想将“4/4”更改为“3/4”或用户想出的任何其他分数。进行这种有条件替换的最简单方法是什么？

谢谢，纳库尔

Answer 1

这是一个允许用户上下切换数字输入的选项：<input type="number" id="fraction-1"/><input type="number" id="fraction-2"/>Current Signature:<div id="current-sig"></div>然后在你的javascript中...// Get the select form elementconst FRACT_1 = 'fract-1'const FRACT_2 = 'fract-2'const fract1 = document.querySelector(`#${FRACT_1}`)const fract2 = document.querySelector(`#${FRACT_2}`)const currentSigDiv = document.querySelector('#current-sig')let currentSignature = '4/4'const changeSignatureByFraction = ({target}) => {&nbsp; &nbsp; if(target.id === FRACT_1)) {&nbsp; &nbsp; &nbsp; &nbsp; currentSignature = `${target.value}${currentSignature.substring(1)}`&nbsp; &nbsp; &nbsp; &nbsp; stave.addClef("treble").addTimeSignature(currentSignature)&nbsp; &nbsp; &nbsp; &nbsp; currentSigDiv.innerHTML = currentSignature&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; currentSignature = `${currentSignature.slice(0, -1)}${target.value}`&nbsp; &nbsp; &nbsp; &nbsp; stave.addClef("treble").addTimeSignature(currentSignature)&nbsp; &nbsp; &nbsp; &nbsp; currentSigDiv.innerHTML = currentSignature&nbsp; &nbsp; }}// Listen for a change eventfract1.addEventListener('change', changeSignatureByFraction)fract2.addEventListener('change', changeSignatureByFraction)currentSigDiv.innerHTML = currentSignature

Answer 2

创建一个包含可能分数的下拉列表。将其值查询到变量中。将变量作为addTimeSignature()方法的参数传递。HTML：<select id="TimeSignatureSelect">&nbsp; &nbsp; <option value='1/4'>1/4</option>&nbsp; &nbsp; <option value='2/4'>2/4</option>&nbsp; &nbsp; <option value='3/4'>3/4</option>&nbsp; &nbsp; <option value='4/4'>4/4</option></select>JS：const timeSig = document.getElementByID('TimeSignatureSelect').value;stave.addClef("treble").addTimeSignature(timeSig);