javascript - 如何处理跨度的更改文本

Question

我正在使用jQuery ，我span1想在一个 span（称为 span1我如何处理跨度的文本更改？

Answer 1

Span 默认没有 'change' 事件。但是您可以手动添加此事件。

监听 span 的 change 事件。

$("#span1").on('change',function(){
     //Do calculation and change value of other span2,span3 here
     $("#span2").text('calculated value');
});

无论您在哪里更改 span1 中的文本。手动触发更改事件。

$("#span1").text('test').trigger('change'); 

Answer 2

您可以使用更改 span1 文本的函数来更改其他文本。

作为一种解决方法，如果您真的希望它有一个change事件，那么不要将文本分配给 span 1。而是在 jQuery 中分配一个输入变量，向它写入一个更改事件，无论您更改 span1 的文本。而是更改输入变量的值，从而触发更改事件，如下所示：

var spanChange = $("<input />");
function someFuncToCalculateAndSetTextForSpan1() {
    //  do work
    spanChange.val($newText).change();
};

$(function() {
    spanChange.change(function(e) {
        var $val = $(this).val(),
            $newVal = some*calc-$val;
        $("#span1").text($val);
        $("#spanWhatever").text($newVal);
    });
});

虽然我真的觉得这种“变通方法”虽然在创建简单更改事件的某些方面很有用，但非常过度扩展，您最好在更改 span1 的同时对其他跨度进行更改。

Answer 3

在这里找到了解决方案

假设您有 span1，因为<span id='span1'>my text</span>
可以通过以下方式捕获文本更改事件：

$(document).ready(function(){
    $("#span1").on('DOMSubtreeModified',function(){
         // text change handler
     });

 });