忍者ブログ

からすまる日誌

2020022803 intra mail

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

2020022803 intra mail

SEO対策をメインにやってるところはやめたほうが大変よろしい
 
実力さえつけば食っていける
そういうところで働いた実績で
踏み台にするにも働きやすい職場とそうでないところがある
働きやすいところがいいな
キャリアアップは可能とのこと
    


http://localhost/php/makino/intra_mail/api/get_mail_data.php
を開いてみましょう
真っ白
よろしい(冒頭のifにおちたから)
 
http://localhost/php/makino/intra_mail/api/get_mail_data.php?i=1
で開いてみましょう
 
実行結果
{"id":"1","m_to":"1","m_from":"2","subject":"\u3069\u3089\u3084\u304d\u3042\u308b\u3088","content":"\u304a\u3044\u3057\u3044\u3069\u3089\u3084\u304d\u3060\u3088\u3002\r\n\u305f\u304f\u3055\u3093\u3082\u3089\u3063\u305f\u3088\u3002","sendtime":"2020-02-21 14:52:36"}
 
json形式で出力されている
かな? 
 
 

クリックをしたときに取得して書き出すjQuaryを書く
 
<script src="../jquery-3.4.1.min.js"></script>
</head>
を追加
 
 <script src="js/mail.js"></script>
</body>
も追加
 

mail.jsを新規作成
function()の丸括弧は必ずいりますよ
()があったときにはじめてブラウザさんが「関数なんやな」とわかるわけで
 
いつもの
 

さて件名をクリックしたときdata-idを送ってほしい
 
ここ
 
jsでこの部分は
td.subjectになる
 
じゃdata-idをconsoleに書き出したかったら?
data-idのあとにいろいろつけた、data-なになには、全部1つのオブジェクトとして取ってくることができる。
なので
obj.id
となる
 
なぜかというと、data-idとかdata-id02とかdata-hogehogeとかdata属性のものはたくさんつくれるし、
その「たくさん」をひとつのオブジェクトとして扱えることによる。
なので、idがほしかったらdataオブジェクトのidをくださいとなる
 
よって正解が
 $('td.subject').on('click', function(){
  var obj = $(this).data();
  console.log(obj.id);
 });
 
指定しているのはクラスだから、クリッカブルなものがたくさんある(いまはメール1通しかないが10通なら同じクラスが10個だ)から、thisがいる
  
data();
これはメソッド
textメソッドとかとおんなじですよ
つまりここはゲッターとして働いている
thisのdataの中身をとってこい的な
 
 

さて取ってきたものを書き出す場所にもidをふっておきますか
mypage.phpにもどって、
<table>
    <tr>
     <th rowspan="3">詳細</th>
     <td colspan="2" id="subject"></td>
    </tr>
    <tr>
     <td id="m_name"></td><td id="sendtime"></td>
    </tr>
    <tr>
     <td colspan="2" id="content"></th>
    </tr>
   </table>
 

クリックしたときにはじめて下側のが出てきてほしい
 
style.cssで
#mailを見えないようにしておく
 
mail.jsで
$(function(){
 //console.log("hoge"); 
 $('td.subject').on('click', function(){
  var obj = $(this).data();
  console.log(obj.id);
  
  $('#mail').css({'display':'block'});
 });
 
});
 
 

//Ajax通信
  $.ajax({
  
  })
  .done(function(d)
仮引数dはdでもdataでもhogeでもOK
 
Ajax通信は3つのブロックに分けて記述する
 
PR

コメント

ブログ内検索

カレンダー

03 2025/04 05
S M T W T F S
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30