jquery - .data が最初のクリックで値を返さない

Question

.data メソッドに値を格納しました。最初のクリックでは機能しませんが、2 回目のクリックでは機能します。

<script type="text/javascript">
$(function(){
$('a').click(function(){
var value=  $('div').data('key');
var txt= $(this).text();
$('div').data('key',txt)
$('span').text(value)
})})
</script>

//html

<div></div>
<a href="#">My text</a>
<span></span>

Answer 1

これは動作するはずです-デモ

最初のクリックで、データを設定する前にデータにアクセスするように結び付けています。

<script type="text/javascript">
$(function(){
    $('a').click(function(){
        var txt= $(this).text();
        $('div').data('key',txt)
        $('span').text($('div').data('key'))
    })
})
</script>

HTML

<div></div>
 <a href="#">My text</a>
<span></span>

Answer 2

実際に設定する前にデータ値にアクセスしています

$(function(){
  $('a').click(function(){
    var value=  $('div').data('key'); // accessing data
    var txt= $(this).text();
    $('div').data('key',txt) // setting data
    $('span').text(value)
  })
})

Answer 3

保存する前に取得しています。var value=...下に移動してみてください$('div').data(...