将值从文本输入传递到javascript函数

Cas*_*nge 2 html javascript input textfield

在我的html文件中,我调用了一个带有两个参数的javascript函数,其中第二个参数是应该保存的文件的名称.

<a id="record_button" onclick="Recorder.record('audio', 'test.wav');" href="javascript:void(0);" title="Record"><img src="images/record.png" width="24" height="24" alt="Record"/></a>
Run Code Online (Sandbox Code Playgroud)

我想创建一个动态变量,它从文本字段中获取值并将其转发为第二个参数(而不是test.wav),以便用户可以确定文件的名称.

<label for="filename">Filename</label>
<input name="filename" type="text">
Run Code Online (Sandbox Code Playgroud)

谢谢.

nra*_*itz 11

如果您为用户输入一个id属性,这会更容易:

<input name="filename" id="filename" type="text">
Run Code Online (Sandbox Code Playgroud)

现在,您可以使用以下命令访问Javascript中的值:

document.getElementById('filename').value
Run Code Online (Sandbox Code Playgroud)

请注意,如果您不控制该Recorder.record()方法,则需要首先验证用户输入(至少要验证它们是否输入了某些内容).我建议将其移至单独的功能,例如:

function recordToFilename() {
    var input = document.getElementById('filename'),
        fileName = input.value;
    if (fileName) {
        Recorder.record('audio', fileName);
    } else {
        alert('Please enter a filename!');
        input.focus();
    }
}
Run Code Online (Sandbox Code Playgroud)

然后只使用该功能:

<a id="record_button" onclick="recordToFilename();" href="javascript:void(0);" title="Record"><img src="images/record.png" width="24" height="24" alt="Record"/></a>
Run Code Online (Sandbox Code Playgroud)

工作示例:http://jsfiddle.net/nrabinowitz/GFpRy/