Q&A
見た感じ動いているようですが？
jsで名前と年齢を入力して送信ボタンをクリックすると入力した情報が一覧に追加されるシステムを作成しているのですが、名前が追加され年齢が追加されないという状態になっています。どのように書けば両方の情報を追加することができますか？
実現したいこと
名前と年齢の両方の情報が追加されるようにしたい
発生している問題・エラーメッセージ
なし
該当のソースコード
<html> <body> 名前 <input type="text" id="input"><br> 年齢 <input type="text" id="age" maxlength="3"><button type="button" onclick="buttonClick()">送信</button> <br>一覧<span id="answer"></span> <ul id="ul" > <li>山田: 33歳</li> <li>佐藤: 22歳</li> <li>田中: 11歳</li> </ul> </body> <script type="text/javascript"> var user_list = [ { name:'山田', age: '33歳' }, { name:'佐藤', age:'22歳' }, { name:'田中', age:'11歳', }, ]; /* var user_list = { { name: '山田', age: '33歳' }, { name: '佐藤', age: '22歳' } }; */ function buttonClick(){ var answer = document.getElementById("answer"); var input = document.getElementById('input').value; var age = document.getElementById('age').value; var age = parseInt(age) var ul = document.getElementById('ul'); var len =ul.children.length; for (var i=0; i<len; i++){ ul.removeChild(ul.children[0]); } if (!isNaN(input) && age =='' || input=='' && isNaN(age) || input=='' && age=='' || !isNaN(input) && isNaN(age)){ document.querySelector('#answer').innerHTML = " : 正しく年齢と名前を入力してください。" ; return; } if(age < -1 || age>=140 ){ document.querySelector('#answer').innerHTML = " : 真面目に年齢を入力してください。" ; return; } if(!isNaN(input) || input==''){ document.querySelector('#answer').innerHTML = " : 正しく名前を入力してください。" ; return; } if (isNaN(age) || age =='' ){ document.querySelector('#answer').innerHTML = " : 正しく年齢を入力してください。" ; return; } var box = { name:input,age:age+"歳"}; user_list.push(box); for ( var i = 0; i < user_list.length; i++ ) { document.querySelector('#answer').innerHTML = "" ; var li = document.createElement('li'); var user = user_list[i]; console.log(user); console.log(user.name); console.log(user.age); li.innerHTML = user.name ,user.age; ul.appendChild(li); } } </script> </html>
回答1件
0
ベストアンサー
js
1x=1,2 2// (x=1),(2) と同等。 3li.innerHTML = user.name ,user.age 4// (li.innerHTML = user.name) ,(user.age) と同等
これは、カンマよりも代入の方が優先順位が高いことによります。
単純に+で連結するのがやりたかったことではないですか？
投稿2022/08/08 02:38
総合スコア37512
あなたの回答
tips
プレビュー
