Как передать значение из html в js

Passing HTML input value as a JavaScript Function Parameter

I am new to JavaScript, and I’m trying to figure out how to pass user-inputted values as a parameter to a JavaScript function. Here is my code:

8 Answers 8

One way is by using document.getElementByID , as below —

Firstly an elements ID should always be unique. If your element IDs aren’t unique then you would always get conflicting results. Imagine in your case using two different elements with the same ID.

1 IDs are meant to be unique

2 You dont need to pass any argument as you can call them in your javascript

You can get the values with use of ID . But ID should be Unique.

do you use jquery? if then:

or use original javascript(DOM)

if you want to learn more, w3chool can help you a lot.

Use this it will work,

I like how most answers here don’t know that javascript accepts every input as string unless we use parseInt. Yes, you can pass parameters in that way. Just a little modification

The Overflow Blog

Linked

Hot Network Questions

Subscribe to RSS

To subscribe to this RSS feed, copy and paste this URL into your RSS reader.

By clicking “Accept all cookies”, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.

Степан Резников

Часто при инициализации JS-компонента нужно найти определенный DOM-элемент с которым компонент будет работать, а также достать из HTML параметры (настройки). О способах хранения и передачи в JS этих параметров я и хотел бы поговорить.

Раньше я решал эту задачу так: простые параметры передавал через классы, сложные — через дополнительные (не всегда валидные) атрибуты или дочерние элементы.

Предположим, у нас есть DOM-элемент:

При клике на этот элемент мы хотим показывать некий попап. Для показа попапа нужно задать следующие параметры: ширина, высота, таскаемость попапа и текст. Раньше я написал бы примерно следующее:

Потом я бы долго и муторно получал значения этих параметров путем выпарсивания их из классов и доставания из дочерних элементов.

Так бы и мучился дальше, если бы мой коллега Дима Филатов не подсказал гораздо более элегантное решение — прописать атрибут onclick в котором возвращать объект с настройками.

Как достать этот объект:

По сути, для передачи настроек используется формат JSON в котором есть шесть типов значений: объект, массив, строка, число, булевское значение и null. Используя эти типы, можно передавать довольно сложную структуру данных, немыслимую для передачи через классы.

Как передать введенное пользователем значение формы из HTML в JavaScript?

Можно передать значение из javascript в html, записав его в тег. Однако, если я хотел бы передать пользовательское значение (и т.д., Введенное лицом, просматривающим веб-страницу), в java script, чтобы я мог что-то делать с ним, что было бы самым простым способом?

На данный момент у меня есть что-то вроде этого:

Как я могу передать значение из формы в мой javascript?

Или я иду в совершенно неправильном направлении? Если да, то каков был бы правильный способ получить пользовательский ввод и передать его на javascript?

EDIT: Извините за мое неправильное использование терминологии. Я делаю текстовую приключенческую игру, и я хочу, чтобы пользователь мог ввести ответ, нажать клавишу ввода и отправить ответ на javascript, чтобы я мог использовать javascript для оценки ответа (и т.д. «На юг» ), «идите на север» ), и напишите обратно элементу с новой ситуацией (и т.д.), когда вы отправились на юг, вы нашли тролля «).

Передача переменной из html в javascript

Javascript записанный инлайном вызывает смешанные чувства.

Во первых это почти всегда не по кодстайлу.

Во вторых трудно отлаживать.

В третьих Такой код не кушируется браузером.

Внимание дорогой читатель пример выше неправильный более чем полностью, о чем предупреждаю сразу и это как раз то как делать не нужно, а вот о том как правильно вдумчиво и внимательно можно прочитать ниже.

Но если вы к примеру не человек высоких моральными принципов, можете смело копировать и делать с этим вообще что угодно, я вам этого не советовал и более того даже отговаривал.

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

Но как же передать значение из php и при этом сохранить красивый код?

Ответ использовать eval() в Javascript.

Рассмотрим пример с подключенимм google maps.

Для начала подключим google maps (библиотеку)

инициализируем начало отрисовки карт сразу после загрузки DOM

Создадим необходимые элементы html

Объяснение этой уличной магии

в js нас интересует строка :

Получает атрибут data-place элемента с id map-canvas после чего eval() преобразует строку [61.784625, 34.350755] в js код , конкретней в массив т.к. присутствуют квадратные скобки.

По спецификации HTML5 ,браузеры пропускают атрибуты тегов начинающихся с data- влиять на отрисовку этот атрибут не будет, но его значение можно использовать в javascript.

Код html можно модифицировать:

с использованием php , так простыми средствами можно передавать целые массивы переменных из php в js не используя инлайнового написания : )