Отправка параметра из формы в функцию в JavaScript
Я пытаюсь отправить значение из формы в новое окно, которое открывается.
В моей программе окно открывается, но значение val2 не отправляется, а вместо него существует null.
Мой код:
function eq(value) {
ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}<form id='testform_eq' name='testform_new'>
<input type='text' id='val2' name='val2'>
<input type='button' value='Submit' onclick='eq(document.getElementById(val2))'>
</form>Кто-нибудь знает, почему это так? Спасибо
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Потому что вы должны сделать это так: document.getElementById("val2").value
document.getElementById(val2) неверно, если вы хотите получить значение id=val2.
Чтобы исправить это, вы можете заменить eq(document.getElementById(val2) на eq(document.getElementById("val2").value)
function eq(value) {
ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
console.info(value);
}<form id='testform_eq' name='testform_new'>
<input type='text' id='val2' name='val2'>
<input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>
</form>или просто поместите идентификатор в вызов функции: eq(val2)
function eq(id) {
ViewImg = window.open('http://localhost/coord.php?' + id.value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
console.info(id.value);
}<form id='testform_eq' name='testform_new'>
<input type='text' id='val2' name='val2'>
<input type='button' value='Submit' onclick='eq(val2)'>
</form>@Archer Это то, что я собираюсь сделать. Чтобы показать, кто из них должен это сделать. Я обновился с рабочей функцией.
Если вы хотите передать значение ввода, вы должны принять во внимание две вещи:
getElementByIdпринимает строку, но вы пытаетесь передать несуществующую переменную- Если вы хотите передать значение, а не элемент, вы должны добавить
.valueпосле элемента
И, наконец, у вас должен получиться такой элемент input:
<input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>
Вот живой пример:
<script>
function eq(value) {
console.info(value);
ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}
</script>
<form id='testform_eq' name='testform_new'>
<input type='text' id='val2' name='val2'>
<input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>
</form>Другой вариант — получить значение внутри функции, как описано здесь. Этот способ хорош, если вы не собираетесь повторно использовать eq с разными значениями. Вы должны выбрать один из них в зависимости от вашего реального случая.
У вас есть идея, как отправить 2 поля, а не одно поле?
Конечно, если вам нужно, вы можете просто передать несколько значений (если вы хотите работать с параметрами) или вместо этого получить оба значения внутри функции.
Так ? <input type='button' value='Submit' onclick='eq(document.getElementById("val2").value,"val3").value)'></form>
Если вы пытаетесь получить значение из другого ввода, оно должно выглядеть так: eq(document.getElementById("val2").value, document.getElementById("val3").value). Но лучше переместить эту логику для получения значений внутри JS-файла и не захламлять свой HTML.
Как насчет функции eq(value) { ? Там тоже нужно изменить количество параметров? Откуда он знает разницу между ценностью и ценностью?
Вы правы, взгляните на мой предыдущий комментарий, я передаю там 2 параметра, вам просто нужно обработать оба внутри метода eq
function eq() {
const value = document.getElementById('val2').value;
ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}<form id='testform_eq' name='testform_new'>
<input type='text' id='val2' name='val2'>
<input type='button' value = "Submit" onclick='eq()'>
</form>Вам не нужно ничего передавать функции щелчка. Поскольку у вас уже есть атрибут id для вашего элемента ввода, вы можете получить значение ввода, когда щелкнете по нему. Вероятно, вы захотите использовать эту функцию в других местах, и это будет означать, что вам придется передавать каждый раз этот элемент.
Если вы действительно хотите что-то передать, вы можете передать сам идентификатор.
eq('val2')
Функция eq будет выглядеть так:
function eq(id){
const value = document.getElementById(id).value;
....
}
Затем вы можете использовать эту функцию в других местах на других входах.
Можно было бы с объяснением, но это правильный ответ (из тех, что пока)
Я вижу разницу только в получении значения, в этом ответе оно находится внутри функции вместо передачи значения в качестве параметра. Я думаю, это дело вкуса, особенно если вы хотите использовать одну и ту же функцию только для открытия и передачи разных значений внутри.
Я отредактировал ответ, и, вероятно, теперь это будет иметь больше смысла.
Это ничего не изменит. Он по-прежнему вызывает
eq()с неопределенным значением, но затем записывает правильное значение в консоль. Вы указали на ошибки в коде, но ничего не сделали, чтобы это исправить.