2012-06-25 53 views
2

您好我正在讀取存儲在div中的html數據標記的兩個數字。當我嘗試將這些數字加在一起時,它們會作爲字符串追加。是否有包含在數據屬性中的數字並將它們作爲數字訪問或將它們轉換回非字符串數字的javascript謝謝。如何使用javascript自定義數據屬性值數字

<div data-Lon1="1.3" data-Lat1="-1.2"></div> 

<script> 
    lon1 = $('#zoom1').attr('data-lon1'); 
    lat1 = $('#zoom1').attr('data-lat1'); 
    console.log(lat1+lon1); 

    //returns '1.3-1.2' (I want .1 in this example) 
</script> 
+1

訪問您可以使用的數據屬性的更簡單方法就是這樣:$(「zoom1」)。data(「lon1」); – Logard

+0

由於某種原因試圖使用data方法訪問數據返回undefined。如果您使用數據方法存儲數據,這是否也適用? – codelove

回答

5

只需使用parseFloat()

var lon1 = parseFloat($('#zoom1').attr('data-lon1')); 
    lat1 = parseFloat$('#zoom1').attr('data-lat1')); 
console.log(lat1+lon1); 

JS Fiddle demo

參考文獻:

+0

這很好,謝謝...你知道如果這比使用data()方法更快嗎? – codelove

+2

@codelove它應該更快,因爲jQuery不需要解釋它是什麼類型的數據,儘管我仍然更喜歡'.data'方法。 –

+0

我在這方面服從凱文B,但我沒有客觀證據支持這種假設(除了簡單的常識,基於工作避稅)。 –

0

有一個稱爲parseFloat JavaScript函數。使用parseFloat($("#zoom1").attr("data-lon1")

3

你可以使用.data()方法,將採取的值正確解析爲基礎類型的護理:

var lon1 = $('#zoom1').data('lon1'); 
var lat1 = $('#zoom1').data('lat1'); 
console.log(lat1 + lon1); 

你會發現,使用.data()方法,當你不再傳遞作爲參數完整的屬性名稱,但只有後綴 - lon1lat1而不是data-lon1data-lat1

而這裏的現場演示:http://jsfiddle.net/E7Av7/

哦,不要忘了給一個正確的ID給您的DIV,使您的數據選擇器返回的東西,你似乎忘了這樣做的代碼片段張貼在你的問題:

<div data-Lon1="1.3" data-Lat1="-1.2" id="zoom1"></div>​ 
0

使用.data()它試圖解析值。

var lon1 = $('div').data('lon1'); 
var lat1 = $('div').data('lat1'); 
console.log(lat1+lon1); 

如果你想要得到的結果是從0.1但是,你必須做一些事情,如:

console.log(Math.round((lat1+lon1) * 100000000000)/100000000000); 

否則你會得到0.10000000000000009代替0.1

Is floating point math broken?

http://jsfiddle.net/E7Av7/1/

相關問題