爲什麼.data不工作？

Question

新手在這裏，我已經超過2小時！ :(

如果有人能告訴我這是爲什麼不工作，我將永遠感激你:)

  @foreach (var c in Model.Cleaner.TimeConfirmations) 
      { 
<label class="glyphicon glyphicon-remove-circle cancelTime thex" data-timeid="12"></label> 
       } 

      } 

然後jQuery的

$(".thex").on('click', function() { 
    var id = $(this).data("timeId") 
    alert(id); 

}); 

爲什麼是ID未定義？！？！ ？！？！？！

Answer 1

區分大小寫錯誤。

Working Fiddle

$(".thex").on('click', function() { 
    var id = $(this).data("timeid") 
    alert(id); 
}); 

Answer 2

的data函數檢索如果你想用駝峯timeId檢索其值的元素的數據屬性值以下列方式中，data("timeid")比賽data-timeid屬性和data("timeId")比賽data-time-id

那麼你需要寫出如下，

<label class="glyphicon glyphicon-remove-circle cancelTime thex" data-time-id="12"></label> 

連字符 HTML中的字符將其標識爲camelCase。

或者您可以使用attr函數獲取它不區分大小寫的搜索屬性的值。欲瞭解更多信息，請查看this

查看下面的代碼片段，我希望它對你有幫助。

$(document).ready(function() { 
 
    $(".thex").on('click', function() { 
 
    var id = $(this).data("timeid") 
 
    console.clear(); 
 
    console.log('data function: ' + id); 
 
    console.log('attr function: ' + $(this).attr('data-timeId')); 
 
    }); 
 

 
    $(".thex-alt").on('click', function() { 
 
    var id = $(this).data("timeId"); 
 
    console.clear(); 
 
    console.log('data function: ' + id); 
 
    }); 
 
});

label { 
 
    padding: 10px; 
 
    display: block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
 
<label class="glyphicon glyphicon-remove-circle cancelTime thex" data-timeid="12">lowercase [data-timeid="12"]</label> 
 
<label class="glyphicon glyphicon-remove-circle cancelTime thex" data-timeid="12">lowercase [data-timeid="12"]</label> 
 
<label class="glyphicon glyphicon-remove-circle cancelTime thex-alt" data-time-id="12">camelCase [data-time-id="12"]</label>