获取span元素的值并将其输出

Get value of span element and output it

本文关键字:输出 span 元素 获取      更新时间:2023-09-26

好的,我对你们花时间回答这个问题印象深刻,非常感谢,我没想到。希望大家关注。

为了解释我的问题,我用了你们所有人都有的小提琴工具。这是我的代码:

enter code herehttp://jsfiddle.net/5xzSy/1/

-我需要的是将跨度中计算的值相加:budgetI+actualI

将代码修改为:使用.text()填充Span并为输入分配一些值。。(由于您使用过jQuery)

http://jsfiddle.net/xubam99v/

HTML代码

<pre>
<input id=primaryB type="text" value="100"></input><input id=primaryA type="text" value="100"></input><span id=primary></span><br />
<input id=spouseB type="text" value="100"></input><input id=spouseA type="text" value="100"></input><span id=spouse></span><br />
Budget: <span id=budget></span> <br />
Actual: <span id=actual></span><br />
</pre>

Javascript/jQuery代码

var primaryBValue = parseFloat($('#primaryB').val()); 
var primaryAValue = parseFloat($('#primaryA').val()); 
$('#primary').html(primaryBValue + primaryAValue);  
var spouseBValue = parseFloat($('#spouseB').val()); 
var spouseAValue = parseFloat($('#spouseA').val()); 
$('#spouse').html(spouseBValue + spouseAValue); 
$('#budget').text(primaryBValue + spouseBValue);
$('#actual').text(primaryAValue + spouseAValue);

在插入后监听更改事件以求和

http://jsfiddle.net/55c5uqhc/2/

$('#primaryB,#primaryA,#spouseB,#spouseA').change(calc);
function calc() {       
                var primaryBValue = parseFloat($('#primaryB').val()); 
                var primaryAValue = parseFloat($('#primaryA').val()); 
                $('#primary').html(primaryBValue + primaryAValue);  
                var spouseBValue = parseFloat($('#spouseB').val()); 
                var spouseAValue = parseFloat($('#spouseA').val()); 
                $('#spouse').html(spouseBValue + spouseAValue); 
                $('#budget').html(primaryBValue + spouseBValue);
                $('#actual').html(primaryAValue + spouseAValue) ;
}

您需要创建一个触发器来填充<span>,也可以使用text()而不是哦html()以下是一个例子(可能是一个糟糕的例子,但它是一个好的起点):

功能:

$('input').keyup(function(e){
    var spouseBValue = parseFloat($('#spouseB').val()); 
    var spouseAValue = parseFloat($('#spouseA').val()); 
    var primaryBValue = parseFloat($('#primaryB').val()); 
    var primaryAValue = parseFloat($('#primaryA').val());
    $('#spouse').text(spouseBValue - (-spouseAValue)); 
    $('#primary').text(primaryBValue - (-primaryAValue));
    $('#budget').text(primaryBValue - (-spouseBValue));
    $('#actual').text(primaryAValue - (-spouseAValue));
});

小提琴