如何使用事件委托？

Question

从下拉框中选择时，我从2个不同的ajax脚本加载了2 <span>个。所以我的代码是这样的

<span id='room_rate'>1, 000</span> // loaded by an ajax script
<span id='total_misc'>500</span> // loaded by another ajax script

<input type='text' id='total'/>

<button type='button' id='compute_total'>Compute</button>

问题：

如何使用事件委派来获取2 <span>中的值，并在点击input text total后将其显示在compute button中吗

<小时/>

我尝试了什么：

$(document).ready(function () {
    $(this).on('click', 'span', function () {
        var room_rate = $('#room_rate').val();
        var total_misc = $('#total_misc').val();

        alert(room_rate + total_misc);
    });
});

我得到了什么：

我没有得到警报，也没有在控制台中出错（F12）

提前感谢您的帮助。

Answer 1

阅读精细手册......

.val()

  

.val()方法主要用于获取表单元素的值，例如input，select和textarea。

您可能需要.text()

我还将代表团添加到您的按钮，而不是跨度，即

$(document).on('click', '#compute_total', function(e) {
    e.preventDefault();

    $('#total').val($('#room_rate').text() + $('#total_misc').text());
});