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

在我的html文件中，我调用一个带有两个参数的JavaScript函数，其中第二个参数是应该保存的文件的名称。将文本输入的值传递到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>

我想作的动态变量，其从文本框采用值和转发作为第二个参数（而不是test.wav），所以用户能够确定该文件的名称。

<label for="filename">Filename</label> 
<input name="filename" type="text">

谢谢。

来源

2011-10-31 Casper Slynge

这是比较容易，如果你给你的用户输入id属性：

document.getElementById('filename').value

需要注意的是，如果你不控制：

<input name="filename" id="filename" type="text">

现在你可以在Javascript访问值在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(); 
    } 
}

然后，只需使用该函数：

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

工作例如：http://jsfiddle.net/nrabinowitz/GFpRy/

来源

2011-10-31 17:11:31 nrabinowitz

好的。只需将'fileName.focus（）'添加到'alert' :) – 2011-10-31 17:23:27

@Márcio - 好主意 - 在上面添加。你也可以让'alert'成为'提示符'，并且可以将输入完全关闭...... – nrabinowitz

感谢您的回复。我在我的HTML文件中创建了一个，并且与您写的完全一样。但是，当我按下录制按钮时不会发生任何事只要我将onclick改为Recorder.record（'audio'，'test.wav'）;它的工作原理，但更改为recordToFilename（）;它不会 –

Recorder.record('audio', document.yourformname.filename.value)

确保有一个name="?"属性为您的表单工作，并将yourformname替换为表单名称。 filename也指输入的name属性。

来源

2011-10-31 17:13:35 casraf

<html> 
<head> 
    <script> 
    function addData (fn, ln, em) { 

     console.log(fn); 
     console.log(ln); 
     console.log(em); 

    } 
</script> 
</head> 
<body> 
    <input Type="text" name="FirstName" id="fn"> 
    <input Type="text" name="LastName" id="ln"> 
    <input Type="email" name="Email" id="em"> 
    <button onClick="addData(fn.value,ln.value,em.value)">click</button> 
</body> 
</html>

来源

2018-01-18 09:23:16

请将解释添加到您的答案中。 –

当javascript代码被修复但html字段id被修改时，我们可以使用这段代码。 –

我可以解决这个问题，但是如果他们没有什么经验（尽管经过6年的JavaScript，他可能应该可以），我怀疑OP是否可以。 – rrd

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

回答

相关问题