【jquery】bind、live、on

bind必需要每一個HtmlElement都要綁定，而live不用，
live適合用在動態新增element，如Ajax下載回來的HTML，
用live其中相同的selector的HtmlElement，就不用重Bind，
可以省去不少麻煩。

//在 jQuery 1.3 以上版本

$(selector).live(events, data, handler);

//在 jQuery 1.4.3 以上版本

$(document).delegate(selector, events, data, handler);

//在 jQuery 1.7 以上版本

$(document).on(events, selector, data, handler);

$(":input").bind("keyup change", function(e) {
    // do stuff!
})

 $("#myform").on("change","input",save_complete);
 $("#myform").on("change","select",save_complete);
 $("#myform").on("click",".del_score",del_score);


https://dotblogs.com.tw/wadehuang36/2010/10/13/jquery-bind-live

【javascript】event.preventDefault() 與 event.stopPropagation()

javascript 要停止執行程式可以用 event.preventDefault() 與 event.stopPropagation()

stopPropagation 可阻止冒泡事件發生

差別：https://dotblogs.com.tw/harry/2016/09/10/131956
https://www.cnblogs.com/jiqing9006/archive/2012/09/11/2679831.html

【AnyDesk】鍵盤設置

如果要用AnyDesk寫程式，
記得要把【設定】裡面的【系統轉換按鍵】取消!!

【Bootstrap】CSS3 icon 圖示

做網頁常常要用到小icon，以前都是用image，
現在可以直接用更方便的bootstrap的css的icon，

https://www.w3schools.com/icons/bootstrap_icons_glyphicons.asp

【HTML5】Google 網頁設計師

Google 發布的HTML5編輯器，圖形化介面可以快速產生HTML5動畫

有空來玩玩

網址：https://www.google.com/webdesigner/

【PHP】HTML直接輸出PDF

可以使用 tcpdf
網址：https://tcpdf.org/
範例：https://tcpdf.org/examples/example_021/

require("class/TCPDF-master/tcpdf.php");
class Mya_tcpdf 
{
 
 public function tcpdf_html($html, $title)
 { 
  // create new PDF document
  $pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
  
  // set document information
  $pdf->SetCreator(PDF_CREATOR);
  $pdf->SetAuthor('');
  $pdf->SetTitle($title);
  $pdf->SetSubject('');
  $pdf->SetKeywords('');
  
  // set default header data
  $pdf->setPrintHeader(false);
  $pdf->setFooterFont(array(PDF_FONT_NAME_DATA, '', 10));
  
  // set default monospaced font
  $pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
  
  // set margins
  //$pdf->SetMargins(PDF_MARGIN_LEFT, PDF_MARGIN_TOP, PDF_MARGIN_RIGHT);
  $pdf->SetMargins(10, 10, 10);
  $pdf->SetHeaderMargin(0);
  $pdf->SetFooterMargin(10);
  
  // set auto page breaks
  $pdf->SetAutoPageBreak(TRUE, 10);
  
  // set image scale factor
  $pdf->setImageScale(PDF_IMAGE_SCALE_RATIO);
  
  // set some language-dependent strings (optional)
  if (@file_exists(dirname(__FILE__).'/lang/eng.php')) {
   require_once(dirname(__FILE__).'/lang/eng.php');
   $pdf->setLanguageArray($l);
  }   
  
  // set font
  $pdf->SetFont('msjh','',1); // 字形需另外下載

  // add a page
  $pdf->AddPage();

  // output the HTML content
  $pdf->writeHTML($html, true, false, true, false, '');

  // reset pointer to the last page
  $pdf->lastPage();

  // ---------------------------------------------------------

  //Close and output PDF document
  $pdf->Output("abc.pdf", 'I');
 } 
 
}

【PHP】HTML Purifier 可過濾HTML限定只能用那些HTML

碰到只能用某些HTML，自己過濾超麻煩，

後來找到好用的套件 ：HTML Purifier

裡面還有很多功能，也可阻擋XSS攻擊

require('class/htmlpurifier/HTMLPurifier.auto.php');

$config = HTMLPurifier_Config::createDefault();


$config->set('HTML', 'Allowed', 
 'a[accesskey|href|rel|tabindex}target|type]
 ,area[accesskey|alt, coords|href|name|shape|tabindex|target]
 ,img[alt|border|height|ismap|src|usemap|width]
 ,b,blockquote[cite],br,dd,div,dl,dt,em,h1,h2,h3,h4,h5,h6
 ,hr,i,li[value],map,ol[start|type]
 ,nav[accesskey|contenteditable|contextmenu|data-*|draggable|dropzone|hidden|spellcheck|tabindex|translate]
 ,ol[start|type],p,pre,rp,rt,ruby,s,small,source,span,strike,strong,style,sub,sup,
 ,table[border|cols|summary|cellpadding|cellspacing|align]
 ,tbody[valign],td[bordercolor|colspan|rowspan],tfoot[valign]
 ,th[colspan|rowspan|scope],thead[valign],tr[colspan|rowspan]
 ,tt,u,ul,video[autoplay|controls|height|loop|muted|poster|preload|src|width]
 '
 );
$purifier = new HTMLPurifier($config);
echo $cleanContent = $purifier->purify($content);

【Jquery UI】拖移(sortable)抓到值

$(".cat1 .type-sort").sortable({update: function (e, ui){
    $current_id = ui.item.attr('id');
    $change_id = ui.item.prev().attr('id');
    console.log(ui.item.attr('id')+'/'+ui.item.prev().attr('id'));

    console.log($("#"+$current_id).html());
  }});

【Jquery】動態產生也可綁定事件

利用Jquery產生出來的物件 (append、prepend)，
在之前設定的$('.item').click()會失效，
要改成 $('body').on('click','.item',funciton (){});

【Jquery】is show 是否可見

判斷物件是否可見：$(element).is(":visible");