setAttributeが上手くいかない
Q&A
Closed
PHP(HTML)で予約フォームを作成し、総合計金額をjavascriptで表示させようと試みています。
そのため、PHP(HTML)のinputタグに、javascriptのsetAttributeで「value=」を追記しようとしてますが、上手くいきません。
console.logを確認したところ、phpのソースから取得した計算要素は正しく取得できていて、表示したい値の合計金額も出ています。
更に、フォーム画面にて合計計算のボタンをクリックすると、合計金額欄に一瞬正しい金額が表示されます。
当然ですが、デバッグツールも一瞬追記しようとしているように思えます。
何かで初期化されてしまっているのかもしれませんが、原因がわかりませんでした。
原因究明にご協力いただければ幸いです。
該当ソースを添付します。
前述の通り、3つのconsole.logは正しく値が出力されます。
<?php ?>
<script>
document.addEventListener('DOMContentLoaded', function(){
document.getElementById('button_commit').addEventListener('click', function() {
let pService = JSON.parse('<?php echo $priceFir; ?>');
let pOption = JSON.parse('<?php echo $priceSec; ?>');
let totalAmount = pService + pOption;
let input = document.getElementById('total_amount');
input.setAttribute('value',totalAmount);
console.log(pService);
console.log(pOption);
console.log(totalAmount);
}, false)
}, false)
</script>
<noscript>
JavaScriptを実行できません。
</noscript>
0
