Как вывести объект из функции?
1) Мне нужно из нескольких полей <input> собрать значения
делал это с помощью document.getElementById("").value; 2) потом обработать их (собрал их в объект) 3) и дальше продолжить работать с ними 1-й и 2-й пункт выполнил с помощью функции. А как мне из этой функции этот объект вывести? |
nEmEc,
понять бы в чём проблема? |
Я в JavaScript ещё новичок. Может и объяснил плохо...
<script> function allFunction(){ function getFormValueA(){ let a = document.getElementById('numberA').value; return a; }; let a = getFormValueA(); function getFormValueB(){ let b = document.getElementById('numberB').value; return b; }; let b = getFormValueB(); function getPopytkiValue(){ let c = document.getElementById('popytki').value; return c; }; let c = getPopytkiValue(); let data = { chislo_1: a, chislo_2: b, popytki: c, }; console.log (`ДО`); console.log (data); return data; }; let data1 = allFunction(); console.log (`ПОСЛЕ`); console.log (data1); </script> <div> <label> Число 1: <input type="number" id="numberA"> </label> </div> <div> <label> Число 2: <input type="number" id="numberB"> </label> </div> <div> Попыток: <input type="number" id="popytki"> </div> <div> <button onclick="allFunction()">Попробовать</button> </div> |
nEmEc,
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [html run] ... минимальный код страницы с вашей проблемой [/html] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
nEmEc,
в вашем коде ошибок нет, но запускать его надо после создания страницы, либо уберите строку let data1 = allFunction(); либо перенесите её вниз страницы. (после всех div) |
function allFunction(){
function getFormValueA(){
let a = document.getElementById('numberA').value;
return a;
};
let a = getFormValueA();
function getFormValueB(){
let b = document.getElementById('numberB').value;
return b;
};
let b = getFormValueB();
function getPopytkiValue(){
let c = document.getElementById('popytki').value;
return c;
};
let c = getPopytkiValue();
let data = {
chislo_1: a,
chislo_2: b,
popytki: c,
};
console.log (`ДО`);
console.log (data);
return data;
};
let data1 = allFunction();
console.log (`ПОСЛЕ`);
console.log (data1);
<div> <label> Число 1: <input type="number" id="numberA"> </label> </div> <div> <label> Число 2: <input type="number" id="numberB"> </label> </div> <div> Попыток: <input type="number" id="popytki"> </div> <div> <button onclick="allFunction()">Попробовать</button> </div> |
Всё равно не работает. Я и в отдельный файл код помещал.
|
console.log (data) всё правильно показывает, а data1 - ничего!
|
nEmEc,
а откуда там что-то будет? если вы сохранили там состояние инпутов на момент загрузки страницы(а они пустые)? |
nEmEc,
вам нужна ещё одна функция в которой вы будите что-то делать с обьектом, вот ней вы и должны вызвать создание объекта, а не хранить его заранее. |
nEmEc,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div>
<label>
Число 1:
<input type="number" id="numberA">
</label>
</div>
<div>
<label>
Число 2:
<input type="number" id="numberB">
</label>
</div>
<div>
Попыток:
<input type="number" id="popytki">
</div>
<div>
<button onclick="data1 = allFunction(); console.log (data1);">Попробовать</button>
</div>
<script>
function allFunction() {
function getFormValueA() {
let a = document.getElementById('numberA').value;
return a;
};
let a = getFormValueA();
function getFormValueB() {
let b = document.getElementById('numberB').value;
return b;
};
let b = getFormValueB();
function getPopytkiValue() {
let c = document.getElementById('popytki').value;
return c;
};
let c = getPopytkiValue();
let data = {
chislo_1: a,
chislo_2: b,
popytki: c,
};
return data;
};
let data1 = allFunction();
</script>
</body>
</html>
|
Нет. Я ввожу туда цифры и нажимаю кнопку.
Например: 1, 2, 3 ввожу Результат: ДО Object { "chislo_1": "1", "chislo_2": "2", "popytki": "3" } |
а лучше так
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div>
<label>
Число 1:
<input type="number" id="numberA">
</label>
</div>
<div>
<label>
Число 2:
<input type="number" id="numberB">
</label>
</div>
<div>
Попыток:
<input type="number" id="popytki">
</div>
<div>
<button onclick="allFunction(); ">Попробовать</button>
</div>
<script>
function getObj() {
function getFormValueA() {
let a = document.getElementById('numberA').value;
return a;
};
let a = getFormValueA();
function getFormValueB() {
let b = document.getElementById('numberB').value;
return b;
};
let b = getFormValueB();
function getPopytkiValue() {
let c = document.getElementById('popytki').value;
return c;
};
let c = getPopytkiValue();
let data = {
chislo_1: a,
chislo_2: b,
popytki: c,
};
return data;
};
function allFunction()
{
let data1 = getObj();
console.log ('data1', data1)
// тут делайте что хотите с объектом
}
</script>
</body>
</html>
|
Получилось!!! Спасибо огромное!
|
| Часовой пояс GMT +3, время: 11:59. |