从Javascript函数获取值以显示在其他地方

我有一个函数可以计算用户选择的票数（从下拉列表中）并将其乘以票证价格（该票证价格存储在我的sql数据库）。从Javascript函数获取值以显示在其他地方

函数本身工作正常：

function quantityChange(selElem) { 
//Select the value of the drop down list  
var quantity = $('#showQuantity option:selected').val(); 
//get the value of the number from the tPrice column in 'ticket' table 
var ticket = parseInt(document.getElementById('ticketPriceHidden').value); 
//get the venue value 
var venue = document.getElementById('venuePlaceHidden').value; 
//multiply them together 
var total = quantity * ticket; 

document.getElementById('summary').innerHTML= 'You have chosen'+ ' ' + quantity + ' ' + 'tickets @' + ' ' + venue + ' = ' + ' ' + ' &pound;' + total; 
}

调用此函数在一个名为“票” DIV，一旦用户从这个功能看到计算总，然后他们按了“继续”按钮，隐藏这个div，并显示一个新的div称为“交付”，所以结果不会被丢弃。

我想要做的是这样的：我想再次获得函数quantityChange（selElem）的结果，但是在一个全新的div中称为'summary'。有没有办法做到这一点？

任何帮助非常感谢，谢谢。

来源

2012-03-14 Tim Johnstone

将函数写成更具抽象性的函数而不是返回值。使用该值调用另一个函数将其设置为“摘要”。完成。 – Smamatti 2012-03-14 16:25:22

这是jQuery和纯DOM方法的有趣组合。你在用什么“selElem”？而不是将元素ID硬编码到函数中，请将其作为参数。或者对计算值更灵活，返回结果。 – 2012-03-14 16:26:08

谢谢你的快速回复。 @Felix King，对于传递参数的语法以及我应该返回的内容，我仍然有点小白。请你能够如此善意地离开我需要编写的代码以使这个功能更加灵活吗？ – 2012-03-14 16:33:44

使它成为一个返回值的泛型函数。

function foo() 
{ 
var a = 0; 
var b = 1; 
return a+b; 
} 

document.getElementById("bar").innerHTML = "Your returned amount is " + foo();

酒吧的innerHTML会读

Your returned amount is 1

来源

2012-03-14 16:36:59 Snuffleupagus

谢谢你的回复。 – 2012-03-14 18:51:16

一种选择是通过元素的ID你想要的文字出现在作为参数传递给函数：

function quantityChange(elementId) { 
    //Select the value of the drop down list  
    var quantity = $('#showQuantity option:selected').val(); 
    //get the value of the number from the tPrice column in 'ticket' table 
    var ticket = +$('#ticketPriceHidden').val(); 
    //get the venue value 
    var venue = $('#venuePlaceHidden').val(); 
    //multiply them together 
    var total = quantity * ticket; 

    $('#' + elementId').html('You have chosen'+ ' ' + quantity + ' ' + 'tickets @' + ' ' + venue + ' = ' + ' ' + ' &pound;' + total); 
}

你打电话为：

quantityChange('summary');

要交流hieve更大的灵活性，您可以返回所有的计算值：

function quantityChange() { 
    //Select the value of the drop down list  
    var quantity = $('#showQuantity option:selected').val(); 
    //get the value of the number from the tPrice column in 'ticket' table 
    var ticket = +$('#ticketPriceHidden').val(); 
    //get the venue value 
    var venue = $('#venuePlaceHidden').val(); 
    //multiply them together 
    var total = quantity * ticket; 

    return { 
     venue: venue, 
     quantity: quantity, 
     ticket: ticket, 
     total: total 
    }; 
}

，并创建调用函数的输出：

var data = quantityChange(); 

$('#summary').text('You have to pay ' + data.total + ' something');

这种方式，实际输出（要如何呈现数据）在计算值的函数中没有被硬编码。

来源

2012-03-14 16:40:33

谢谢您的回复！这真是太棒了:)虽然有一个问题，当你说'在调用函数中创建输出'并显示代码时......这个var data = quantityChange（）是一个新函数吗？ – 2012-03-14 17:13:23

这不是一个函数，但它可以是* in *函数。就在你的代码的其他地方，例如作为对按钮点击的响应。 – 2012-03-14 17:15:37

当我执行你建议的内容时，我从控制台收到一个错误消息：document.getElementById（'ticketPriceHidden'）为null：/ – 2012-03-14 17:18:51

这些行应该可以帮到你。

第一行创建一个div。

第二行将您的函数结果插入该div。

第三行将div悬挂在您给出ID为“xxx”的元素上。

var div = document.createElement("div"); 
div.innerHTML = functionResult; 
document.getElementById("xxx").appendChild(div);

来源

2012-03-14 16:41:58 Tom

谢谢你的回复。 – 2012-03-14 18:50:58

从Javascript函数获取值以显示在其他地方

回答

相关问题