0

テーブルを構築する php から json ajax データを取得するためのボタンを押すと、テーブルの見出し (asc、dsc) をクリックすると問題が発生します。テーブル内の値を並べ替えるには、テーブル見出しで関数 sortresult を使用します。関数のソート結果がテーブルを構築します。json データを正常に受信しました。

データを表示するためにボタンを使用しない場合 (コードを少し変更するだけ)、自動的に ajax を使用して json を取得し、テーブルを作成すると、クリックは正常に機能します。ボタンで動作しない問題は何ですか?

だから私は機能を持っています:

 $(document).ready(function(){
     $('#submit').click(function(event){
         $('#headings th').click(function(){
             $('#results').html("");
         var id=$(this).attr('id');
         var asc =(!$(this).attr('asc'));
         $('#headings th').each(function () {
             $(this).removeAttr('asc');
         });
             if(asc) $(this).attr('asc','asc');
        sortResult(id, asc);
         });
     showResult();
 });
 });

関数 sortResult:

 function sortResult(prop, asc){
      var val=null; 
      dataOut = dataOut.sort(function(a,b){
      if(asc) return (a[prop] > b[prop]);
          else return (b[prop] > a[prop]);
      });
      showResult();
 }

関数 showresult:

 function showResult(){
      var html='';
      for (var i in dataOut){
           html +='<tr>'
           +'<td>'+dataOut[i].email+'</td>'
           ...
           +'</tr>'
      }
      html+='</table>'
      $('#results').html(html);
 }
4

2 に答える 2

1

要素を動的に作成するため、次のイベントに登録する必要がありますon

$(document).ready(function(){
     $(body).on("click", "#headings th", function(){
         $('#results').html("");
         var id=$(this).attr('id');
         var asc =(!$(this).attr('asc'));
         $('#headings th').each(function () {
              $(this).removeAttr('asc');
         });
         if(asc) $(this).attr('asc','asc');
         sortResult(id, asc);
     });
     $('#submit').click(function(event){
       showResult();
     });
});
于 2013-10-10T19:16:45.723 に答える
0

クリックしている要素が ajax リクエストによって追加された場合、'click' の代わりに jQuery 'on' を使用する必要があります。

http://api.jquery.com/on/

$(document).ready(function(){
    $('#submit').click(function(event){
        $('#headings th').on('click', function(){
            $('#results').html("");
            var id=$(this).attr('id');
            var asc =(!$(this).attr('asc'));
            $('#headings th').each(function () {
                $(this).removeAttr('asc');
            });
            if(asc) $(this).attr('asc','asc');
            sortResult(id, asc);
        });
        showResult();
   });
});
于 2013-10-10T19:17:51.423 に答える