2012-03-14 58 views
0

我有一個函數可以計算用戶選擇的票數(從下拉列表中)並將其乘以票證價格(該票證價格存儲在我的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 + ' = ' + ' ' + ' £' + total; 
} 

調用此函數在一個名爲「票」 DIV,一旦用戶從這個功能看到計算總,然後他們按了「繼續」按鈕,隱藏這個div,並顯示一個新的div稱爲「交付」,所以結果不會被丟棄。

我想要做的是這樣的:我想再次獲得函數quantityChange(selElem)的結果,但是在一個全新的div中稱爲'summary'。有沒有辦法做到這一點?

任何幫助非常感謝,謝謝。

+0

將函數寫成更具抽象性的函數而不是返回值。使用該值調用另一個函數將其設置爲「摘要」。完成。 – Smamatti 2012-03-14 16:25:22

+1

這是jQuery和純DOM方法的有趣組合。你在用什麼「selElem」?而不是將元素ID硬編碼到函數中,請將其作爲參數。或者對計算值更靈活,返回結果。 – 2012-03-14 16:26:08

+0

謝謝你的快速回復。 @Felix King,對於傳遞參數的語法以及我應該返回的內容,我仍然有點小白。請你能夠如此善意地離開我需要編寫的代碼以使這個功能更加靈活嗎? – 2012-03-14 16:33:44

回答

0

使它成爲一個返回值的泛型函數。

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 
+0

謝謝你的回覆。 – 2012-03-14 18:51:16

1

一種選擇是通過元素的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 + ' = ' + ' ' + ' £' + 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'); 

這種方式,實際輸出(要如何呈現數據)在計算值的函數中沒有被硬編碼。

+0

謝謝您的回覆!這真是太棒了:)雖然有一個問題,當你說'在調用函數中創建輸出'並顯示代碼時......這個var data = quantityChange()是一個新函數嗎? – 2012-03-14 17:13:23

+0

這不是一個函數,但它可以是* in *函數。就在你的代碼的其他地方,例如作爲對按鈕點擊的響應。 – 2012-03-14 17:15:37

+0

當我執行你建議的內容時,我從控制檯收到一個錯誤消息:document.getElementById('ticketPriceHidden')爲null:/ – 2012-03-14 17:18:51

0

這些行應該可以幫到你。

第一行創建一個div。

第二行將您的函數結果插入該div。

第三行將div懸掛在您給出ID爲「xxx」的元素上。

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

謝謝你的回覆。 – 2012-03-14 18:50:58

相關問題