MVC görünüm aşağıdaki alan var:

@Html.TextBoxFor(model => model.Course.Title, new { data_helptext = "Old Text" })</span>

Ayrı bir js dosyasında bir dize değeri data-helptext özniteliğini ayarlamak istiyorum. İşte benim kod:

alert($(targetField).data("helptext"));

$(targetField).data("helptext", "Testing 123");

alert() çağrı gayet iyi çalışıyor, metin" bir uyarı iletişim içinde. "Eski Metin gösterir Ancak, 123" çalışmıyor. "Test etmek için data-helptext özniteliği ayarlamak için çağrı "" Hala özniteliği geçerli bir değerdir. eski Metin

Veri çağrısı kullanıyorum() yanlış? Bu web izledim ve neyi yanlış yaptığımı göremiyorum.

DÜZENLEME:

İşte HTML biçimlendirme:

<input data-helptext="Old Text" id="Course_Title" name="Course.Title" type="text" value="" />

.data() documentation söz edilir

Veri nitelikler veri özelliği erişilen ilk kez çekilir ve sonra artık erişilebilir ya da mutasyona uğramış (tüm veri değerleri sonra içten bir WordPress kullanmak saklanır)

Bu da Why don't changes to jQuery $.fn.data() update the corresponding html 5 data-* attributes? kaplıydı

Benim orijinal cevap demoyu aşağıda artık çalışmak için görünmüyor.

Cevap güncelledi

Yine, .data() documentation

Gömülü tire ile öznitelikleri tedavisi jQuery 1.6 W3C HTML5 şartnameye uygun olarak değiştirilmiştir.

Yani <div data-role="page"></div> aşağıdaki 16 ** doğrudur

$('div').data('data-role') geçmişte çalıştığı oldukça eminim ama böyle daha fazla görünmüyor. Ve multi-tire ek bir örnek data- attributes dönüşüm camelCase için Konsol ekledi açmak yerine günlükleri HTML olan daha iyi bir vitrin oluşturduk.

Updated demo (2015-07-25)

Ayrıca jQuery Data vs Attr? bkz

HTML

<div id="changeMe" data-key="luke" data-another-key="vader"></div>
<a href="#" id="changeData"></a>
<table id="log">
    <tr><th>Setter</th><th>Getter</th><th>Result of calling getter</th><th>Notes</th></tr>
</table>

JavaScript(jQuery 1.6.2 )

var $changeMe = $('#changeMe');
var $log = $('#log');

var logger;
(logger = function(setter, getter, note) {
    note = note || '';
    eval('$changeMe'   setter);
    var result = eval('$changeMe'   getter);
    $log.append('<tr><td><code>'   setter   '</code></td><td><code>'   getter   '</code></td><td>'   result   '</td><td>'   note   '</td></tr>');
})('', ".data('key')", "Initial value");

$('#changeData').click(function() {
    // set data-key to new value
    logger(".data('key', 'leia')", ".data('key')", "expect leia on jQuery node object but DOM stays as luke");
    // try and set data-key via .attr and get via some methods
    logger(".attr('data-key', 'yoda')", ".data('key')", "expect leia (still) on jQuery object but DOM now yoda");
    logger("", ".attr('key')", "expect undefined (no attr <code>key</code>)");
    logger("", ".attr('data-key')", "expect yoda in DOM and on jQuery object");

    // bonus points
    logger('', ".data('data-key')", "expect undefined (cannot get via this method)");
    logger(".data('anotherKey')", ".data('anotherKey')", "jQuery 1.6  get multi hyphen <code>data-another-key</code>");
    logger(".data('another-key')", ".data('another-key')", "jQuery < 1.6 get multi hyphen <code>data-another-key</code> (also supported in jQuery 1.6 )");

    return false;
});

$('#changeData').click();

Older demo

Orijinal cevap

HTML: bu

<div id="foo" data-helptext="bar"></div>
<a href="#" id="changeData">change data value</a>

ve bu JavaScript (jQuery 1.6.2)

console.log($('#foo').data('helptext'));

$('#changeData').click(function() {
    $('#foo').data('helptext', 'Testing 123');
//  $('#foo').attr('data-helptext', 'Testing 123');
    console.log($('#foo').data('data-helptext'));
    return false;
});

See demo

Chrome DevTools kullanarakKonsolDOM incelemek için, $('#foo').data('helptext', 'Testing 123');değildeğer olarak güncelleyinKonsolama $('#foo').attr('data-helptext', 'Testing 123');.