通过下拉动态​​动态更新总数

时间:2012-07-20 08:31:24

标签: javascript jquery

我有点困境,我试图让它成为当用户从下拉框中选择一个选项时,它会动态更新同一页面上的总数,而不会重新加载。

换句话说,我在下拉框(1,2,3,4,5)中有5个不同的选项,如果用户选择1,则需要通过一个简单的等式,然后输出“总数” “右边的方框,问题我想动态地做这个没有重新加载,任何人都可以给我任何建议或提示我应该使用什么和任何可能有帮助的教程(代码等...)

由于

3 个答案:

答案 0 :(得分:1)

应该用Javascript完成。我建议使用jQuery作为Javascript框架http://jquery.com/

有了它,你可以很容易地做到你想做的事情:

$("select").change(function(){
     var currentValue = parseInt($(this).find("option:selected").val());
     //do whatever calculation e.g
     result = currentValue * 2 + 1;
     //output result somewhere on the page e.g.
     $("#output").html(result);
})

答案 1 :(得分:0)

//这是您必须在页面中使用ddl

的jquery
$(document).ready(function () {
        $("#FloorId").change(function () {
            var ddlValue = $(this).val();

                $.getJSON('calculate.php', { "Id": ddlValue }, function (obj) {
                    $("total").text(obj.value);
                });
        });
    });

在计算页面中返回总计

答案 2 :(得分:0)

如果您不需要将其存储在数据库中,则在客户端使用jquery即可。 在选择更改上,您从“readonly”设置的输入中检索总数,然后添加用户选择的当前数字。记得重置选择或用户不能添加两次相同的号码:

$(document).ready(function(){
    $('select#add').change(function(){
     var  total = parseInt($('input#total').val())+parseInt($(this).val());
     $('input#total').val(total);
        $('select#add option[value=""]').attr('selected', true);
    });
});

有关html

的工作示例,请参阅此http://jsfiddle.net/3TMK8/