Передача значения из текстового ввода в функцию JavaScript - PullRequest
Новая
       12

Передача значения из текстового ввода в функцию JavaScript

2 голосов
/ 31 октября 2011

Внутри моего 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>

Я хотел бы создать динамическую переменную, которая получает значение из текстового поля и передает его в качестве второго параметра (вместо test.wav), чтобы пользователь мог определить имя файла.

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

Спасибо.

Ответы [ 3 ]

11 голосов
/ 31 октября 2011

Это проще, если вы введете свой пользовательский атрибут id: 

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

Теперь вы можете получить доступ к значению в Javascript с помощью: 

document.getElementById('filename').value

Обратите внимание, что есливы не контролируете метод 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/

2 голосов
/ 31 октября 2011 
Recorder.record('audio', document.yourformname.filename.value)

Убедитесь, что для вашей формы есть атрибут name="?", чтобы он работал, и замените yourformname тем, что вы указали в качестве имени формы.filename также относится к атрибуту name ввода.

1 голос
/ 18 января 2018 
<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>
...