2015-08-21 52 views
0

我在jQuery數據函數中遇到了一些麻煩。jquery data()不起作用

$(e.target).data(「unitId」)未定義。

我一直在嘗試解決這一段時間,但無法找到我的代碼有什麼問題。

有沒有人看到這裏有什麼問題?

var SomeView = Backbone.View.extend({ 
    el: '#sidebar', 
    events: { 
     "click .link-unit": "route" 
    }, 
    initialize: function(){ 

     this.render(); 

    }, 
    render: function(){ 
     this.$el.html('<div class="link-unit" data-unitId="some data">some text</div>'); 
    }, 
    route: function(e){ 
     console.log($(e.target).data('unitId')); 
    }, 
}); 
+1

? – Alex

+0

你能提供相關的標記嗎? – PeterKA

回答

4

當你請求.data("dataId")與駝峯,jQuery的是轉成屬性"data-data-id"的請求。

您可以通過不使用camelcase來修復它。例如,如果在HTML和jQuery中都使用全部小寫字母來表示屬性名稱,那麼它就可以正常工作。或者,您可以更改HTML以使用"data-data-id"作爲屬性名稱,並將camelcase保留在HTML中。

這個解釋從the jQuery doc

<div data-role="page" data-last-value="43" data-hidden="true" data-options='{"name":"John"}'></div>

$("div").data("lastValue") === 43;

該...上面的代碼正確地是指該元素的 data-last-value屬性。如果 與傳遞的鍵沒有存儲數據,則jQuery在 元素的屬性中進行搜索,將駝峯字符串轉換爲虛線字符串,然後將數據前置到結果中。所以,字符串lastValue將 轉換爲data-last-value

工作演示:當你叫`$(e.target)。數據( 「單元ID」)`http://jsfiddle.net/jfriend00/uaoL0hdn/

0

而是嘗試:

$(e.target).data("unitid") 

總是嘗試全部使用小寫在你的標記和代碼,這樣你就不會遇到這樣的問題。

例如,假設下面的HTML:

<div data-role="page" data-last-value="43" data-hidden="true" data-options='{"name":"John"}'></div> 

以下jQuery代碼將工作的全部。

$("div").data("role") === "page"; 
$("div").data("lastValue") === 43; 
$("div").data("hidden") === true; 
$("div").data("options").name === "John"; 

代碼的第二個語句上述正確地是指該元素的 data-last-value屬性。如果 與傳遞的鍵沒有存儲數據,則jQuery搜索 元素的屬性,將駝峯字符串轉換爲虛線字符串,然後將數據前置到結果。所以,字符串lastValue被轉換爲 爲data-last-value

編號:https://api.jquery.com/data/

+0

'數據'是區分大小寫的 – Alex

+0

謝謝,它確實有效。 我很驚訝,因爲在他們給出的例子中包含大寫的JQuery數據()文檔 –