Назначение html-формы для ввода переменной JS

Question

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

Я пытаюсь выложить это в виде оповещения в виде быстрого цикла обратной связи, и все, что я продолжаю получать, - это [object HTMLInputElement].Я пытался использовать document.forms [0] и document.getElementById (как показано ниже), и ни одна из них не работает.Кроме того, я использую начальную загрузку, может ли это осложнить эту проблему?

Что мне не хватает?

Вот код:

<div class="hero-unit">
    <h1> Title </h1>
    <p> This form description </p>  
    <form class="well" name="formInput" action= "#">
        <label>Input</label>
        <input Id="txtvarInput" class="span3" style="margin: 0pt auto;" type="text" placeholder="AAA, BBB, CCC..." data-provide="typeahead" data-items="10" data-source="[&quot;AAA&quot;,&quot;BBB&quot;,&quot;CCC&quot;,&quot;DDD&quot;,&quot;EEE&quot;,&quot;FFF&quot;,&quot;GGG&quot;,&quot;HHH&quot;,&quot;III&quot;,&quot;JJJ&quot;,&quot;KKK&quot;,&quot;LLL&quot;]"/>               
        </label>
        <div class="form-actions" "span3">
            <input name="submit" type="submit" class="btn" value="Select" onclick="alert('you chose ' + theInput.value)"/>
            <script language="JavaScript" type="Text/JavaScript">
                var theInput = document.getElementById('txtvarInput');
            </script>
        </div>
    </form>
</div>

<div class="page-header">
    <h1>Input:
        <script language="JavaScript" type="Text/JavaScript">
            document.write(theInput.value);
        </script>
    </h1>

Редактировать: ЧАСТЬ IIТеперь код работает для предупреждения, но мне нужно использовать его в другом месте (как я уже сказал), а переменная недоступна в других разделах HTML.Выше я просто пытаюсь заставить его отображать то же значение, что и часть HTML.Это может быть мой JS, но это довольно типичные вещи, так что я думаю, что это связано с расположением переменной.

Что мне нужно, чтобы использовать ее в другом месте?Я добавил следующий div выше, чтобы показать, что я пытаюсь.

- оставил дополнительное объявление переменной в части II случайно, был одним из тестов, которые я пытался, сейчас удален.

Answer 1

В данный момент объект, который вы alert представляете, является элементом HTML, а не строкой. Вы можете получить его значение, используя свойство value:

alert('you chose ' + theInput.value)

---

(Обратите внимание, что вы, вероятно, не имели в виду:

* * 1010

Как подсказывают другие ответы, потому что это даст вам пустую строку. Это читается только один раз.)

Answer 2

В сообщении используйте

theInput.value

Answer 3

Вы пытаетесь вывести весь выбранный вами HTML-объект, а не его значение-свойство. Поскольку alert() ожидает строку, JavaScript дает вам строковое представление этого объекта, которое [object HTMLInputElement].

Попробуйте вместо этого:

var theInput = document.getElementById('txtvarInput').value;

Answer 4

Вы собираетесь напечатать значение ввода во время загрузки страницы.Вы получите пустое оповещение.

просто сделай это!

    <input name="submit" type="submit" class="btn" value="Select" onclick="alertVal()"/>
    <script language="JavaScript" type="Text/JavaScript">
function alertVal(){
        var theInput = document.getElementById('txtvarInput').value;
        alert('you chose ' + theInput);

}
    </script>

Answer 5

var theInput = document.getElementById('txtvarInput');

должно быть

var theInput = document.getElementById('txtvarInput').value;

Answer 6

Вы забыли .значение

Что-то вроде:

   document.getElementById('txtvarInput').value

Answer 7

Вам необходимо использовать свойство value:

  var theInput = document.getElementById('txtvarInput').value;