Вывод в форму результата работы функции в js

08 февраля 2022, 09:30

<form>
  <fieldset>
    <legend>Результаты вычислений</legend>
    <p>
      <input type="text" id="outputvalue" value="" placeholder="Вывод    данных">
    </p>   
    <p>
      <button type="reset">Сброс</button>  
    </p>
  </fieldset>
</form>
<script type="text/javascript">
    let keys = ['Sun', 'Mon', 'Thu', 'Wen', 'The', 'Fry', 'Sat'];
    let values = [1, 2, 3, 4, 5, 6, 7];
    let obj = {};
    for (let i = 0; i <=6; i++) {
      obj[keys[i]] = values[i];
    }
    console.log(obj);
    document.getElementById('outputvalue').value = ?;
</script>

Прошу прощения за тупость, но может найдётся кто нибудь, кто подскажет чайнику как вывести результаты (obj) в форму? Мне не важен конкретный пример -- хотелось бы понять как выводить подобное в формы. В консоль выводится. Если указываю значения переменных(keys или values) -- выводится.

Answer 1

То есть Вы хотите выдать в текстовое поле с id="outputvalue" обьект? Ну в таком случае его необходимо сериализовать или как-то иначе представить строкой.

Попробуйте:

document.getElementById('outputvalue').value = JSON.stringify(obj)

Answer 2

Это имеете ввиду?

let keys = ['Sun', 'Mon', 'Thu', 'Wen', 'The', 'Fry', 'Sat']; 
let values = [1, 2, 3, 4, 5, 6, 7]; 
let obj = {}; 
for (let i = 0; i <= 6; i++) { 
  obj[keys[i]] = values[i]; 
} 
document.getElementById('outputvalue').value = obj['Sun'];

<form> 
  <fieldset> 
    <legend>Результаты вычислений</legend> 
    <p> 
      <input type="text" id="outputvalue" value="" placeholder="Вывод    данных"> 
    </p> 
    <p> 
      <button type="reset">Сброс</button> 
    </p> 
  </fieldset> 
</form>

Вы можете запоминать значение дня недели из массива и записывать это в переменную и передать в input

let keys = ['Sun', 'Mon', 'Thu', 'Wen', 'The', 'Fry', 'Sat']; 
let values = [1, 2, 3, 4, 5, 6, 7]; 
let obj = {}; 
for (let i = 0; i <= 6; i++) { 
  obj[keys[i]] = values[i]; 
} 
 
let day = keys[1]; // значение, которое можно считать в программе 
 
document.getElementById('outputvalue').value = obj[day];

<form> 
  <fieldset> 
    <legend>Результаты вычислений</legend> 
    <p> 
      <input type="text" id="outputvalue" value="" placeholder="Вывод    данных"> 
    </p> 
    <p> 
      <button type="reset">Сброс</button> 
    </p> 
  </fieldset> 
</form>

Также вы можете передать день недели в input, с помощью Object.keys(obj), чтобы узнать имя элемента в объекте, в данном примере переменная num = 1, выводится второй элемент массива Object.keys(obj), который начинается с нуля

let keys = ['Sun', 'Mon', 'Thu', 'Wen', 'The', 'Fry', 'Sat']; 
let values = [1, 2, 3, 4, 5, 6, 7]; 
let obj = {}; 
for (let i = 0; i <= 6; i++) { 
  obj[keys[i]] = values[i]; 
} 
 
let num = 1; // значение, которое можно считать в программе 
 
document.getElementById('outputvalue').value = Object.keys(obj)[num];

<form> 
  <fieldset> 
    <legend>Результаты вычислений</legend> 
    <p> 
      <input type="text" id="outputvalue" value="" placeholder="Вывод    данных"> 
    </p> 
    <p> 
      <button type="reset">Сброс</button> 
    </p> 
  </fieldset> 
</form>