复选框切换并复制 div 值
checkbox toggle and duplicate div value
我正在使用以下脚本在中间的 2 个设定值 $0 和 $53,498 之间切换 div #t1.
<div class="row mb-3">
<div class="col-md-4 themed-grid-col"><label><input type="checkbox" autocomplete="off" onclick="t1()"> Tuition</label></div>
<div class="col-md-4 themed-grid-col"><div id="t1">[=11=]</div></div>
<div class="col-md-4 themed-grid-col"><div id="t1-total"></div></div>
</div>
function myFunction() {
const element = document.getElementById('demo')
element.innerHTML = element.innerHTML === '[=12=]' ? ',498' : '[=12=]'
}
当我在 $0 和 $53,498 这两个值之间切换时,我如何将切换后的值应用到最后一个 div #t1-total。
根据屏幕截图screenshot,我希望 div 3 中的值等于 div 2 中的值,因为我切换 div 1.
中的复选框
我似乎只能检索到 $0 的值,而不能检索到 $53,498。
function myFunction() {
const element = document.getElementById('demo')
element.innerText = element.innerText === '[=10=]' ? ',498' : '[=10=]'
document.getElementById('t1-total').innerText = element.innerText
}
编辑:因为您在评论中询问它 -> 完整示例。
let tuitionFee = 0
let activityFee = 0
const toggle () => {
const tuition = document.getElementById('tuition')
const activity = document.getElementById('activity')
const total = document.getElementById('total')
tuitionFee = tuitionFee === 0 ? 100 : 0
activityFee = activityFee === 0 ? 100 : 0
tuition.innerText = '$' + tuitionFee
activity.innerText = '$' + activityFee
total.innerText = '$' + (tuitionFee + activityFee)
}
现在调用你的切换函数。
function t1(){
const element = document.getElementById('t1-total');
element.innerHTML = ((element.innerHTML === '[=10=]' || element.innerHTML.trim() == '') ? ',498' : '[=10=]');
}
<div>
<div class="col-md-4 themed-grid-col">
<label><input type="checkbox" autocomplete="off" onclick="t1()"> Tuition</label>
</div>
<div class="col-md-4 themed-grid-col"><div id="t1">[=11=]</div></div>
<div class="col-md-4 themed-grid-col" id="t1-total"> </div>
</div>
我正在使用以下脚本在中间的 2 个设定值 $0 和 $53,498 之间切换 div #t1.
<div class="row mb-3">
<div class="col-md-4 themed-grid-col"><label><input type="checkbox" autocomplete="off" onclick="t1()"> Tuition</label></div>
<div class="col-md-4 themed-grid-col"><div id="t1">[=11=]</div></div>
<div class="col-md-4 themed-grid-col"><div id="t1-total"></div></div>
</div>
function myFunction() {
const element = document.getElementById('demo')
element.innerHTML = element.innerHTML === '[=12=]' ? ',498' : '[=12=]'
}
当我在 $0 和 $53,498 这两个值之间切换时,我如何将切换后的值应用到最后一个 div #t1-total。 根据屏幕截图screenshot,我希望 div 3 中的值等于 div 2 中的值,因为我切换 div 1.
中的复选框我似乎只能检索到 $0 的值,而不能检索到 $53,498。
function myFunction() {
const element = document.getElementById('demo')
element.innerText = element.innerText === '[=10=]' ? ',498' : '[=10=]'
document.getElementById('t1-total').innerText = element.innerText
}
编辑:因为您在评论中询问它 -> 完整示例。
let tuitionFee = 0
let activityFee = 0
const toggle () => {
const tuition = document.getElementById('tuition')
const activity = document.getElementById('activity')
const total = document.getElementById('total')
tuitionFee = tuitionFee === 0 ? 100 : 0
activityFee = activityFee === 0 ? 100 : 0
tuition.innerText = '$' + tuitionFee
activity.innerText = '$' + activityFee
total.innerText = '$' + (tuitionFee + activityFee)
}
现在调用你的切换函数。
function t1(){
const element = document.getElementById('t1-total');
element.innerHTML = ((element.innerHTML === '[=10=]' || element.innerHTML.trim() == '') ? ',498' : '[=10=]');
}
<div>
<div class="col-md-4 themed-grid-col">
<label><input type="checkbox" autocomplete="off" onclick="t1()"> Tuition</label>
</div>
<div class="col-md-4 themed-grid-col"><div id="t1">[=11=]</div></div>
<div class="col-md-4 themed-grid-col" id="t1-total"> </div>
</div>