2016-05-13 11 views
1

別のdivのデータattrが変更されたときにdivの値を変更しようとしています。私はデータオンの変更を検出する

$('.language-rate').attr("data-rate-value").on('change', function() { 
    $('.language-d').text($('.language-rate').attr("data-rate-value")); 
}); 

ことをやろうとしているが、それは、コンソールにログインする:

Uncaught TypeError: Cannot read property 'on' of undefined

はどのように私はそれを行うことができますか?

私の見解は次のとおりです。

   @using (Ajax.BeginForm("LanguagesTable", new AjaxOptions() 
       { 
        InsertionMode = InsertionMode.Replace, 
        UpdateTargetId = "languages" 
       })) 
       { 
        <div class="language-content"> 
         @Html.TextBoxFor(m => m.newLanguages.LanguageName, new { @class = "pcontent-left main-color" }) 
         <div class="rate language-rate"></div> 
         @Html.HiddenFor(m => m.newLanguages.Star, new { @class = "language-d" }) 
        </div> 

        <div class="add-education"> 
         <button type="submit" name="pcprograms" value="add" class="add-education-button-sm">add</button> 
        </div> 
       } 

(隠しフォームcontrollある)

を私はrater jsを使用していますし、スターレートの変動が、私は私のモデルで検出して渡したいときEDITED

私はそれをしています:

$('.language-rate').on('change', function() { 
    $('.language-d').text($('.language-rate').attr("data-rate-value")); 
}); 

ですが、divの2回目のクリック後に機能します。あなたが属性変更イベントを検出したいからです。

+0

と何がやりたいと何にを明確に予想通り。他の部門のデータattrはどのように変更されますか? – guradio

+0

@guradio私はrater jsを使用しています。複雑なhtml(asp.net mvc razor)だから投稿していないので – gsiradze

+0

@guradio編集 – gsiradze

答えて

0

残念ながら、データ属性にイベントをフックすることはできません.SOやその他のソースでイベントをフックできません。何度も実行する関数を作成することです200ミリ秒ごと)をチェックあなたのdivのデータ属性の値がchanged.Hereの例を持っている場合、私はそれはあなたを助け願っています:だけでなく、共有のhtml

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     var _old = $("#test").attr('data-value'); 

     setInterval(function() { 
      var _new = $("#test").attr('data-value'); 

      if(_old != _new) 
      { 
       alert('The data attribute of the div has been changed to - ' + _new); 
       _old = _new; 
      } 

     }, 200); 

     $("#changeData").click(function() { 
      $("#test").attr('data-value',new Date().toLocaleTimeString()); 
     }); 

    }); 
</script> 
<div id="test" data-value="Test"> 
</div> 
<input type="button" id="changeData" value="Change Data Attribute" /> 
関連する問題