Badsupldn's Blog

前言. 因為工作需要使用APP廣播功能,所以想了以下幾種方式,不過都不可行 原本想說使用 UDP 來使用,但是前端機器為不同網域,所以沒辦法使用. 改用 TCP/IP 來串,又發現前端機器都是透過不同路由,使用內部虛擬IP,所以主機無法將資訊丟到前端機器. 使用 ASP 聊天室,應該是可行的方式,不過傳統方式需要定時跟主機要資料,仍然無法做到所謂即時,而且網路及主機負荷增加 解決方式 2022/11/29 後來 google 才發現 websocket 可實現非傳統聊天室功能,可以由前端建立連線後,等待主機端或其他方傳送資訊即可. 進階了解後, SignalR 架構在 websocket 之上,更方便使用者開發,發現已經是非常成熟的技術,看來我已經落伍好幾個世代了... 現在使用 SignalR 開發推播功能,再過幾天應該跨機台都能完成了 ASP.NET 注意事項 新建專案,需自行增加 JSON 管理 NuGet 套件 > 搜尋 JSON > Newtonsoft.Json 建立空白類別記得需要繼承 hub , 不然一堆事件函式都會錯誤 public class ChatHub: Hub 忘記怎麼使用的話 , Google 關鍵字 signalr 聊天室教學

 CSS 外部載入 <style> @import url(URL) </style> CSS 選擇器 元素(標籤) element {} 範例:所有使用 div 的元素 div {...} <div> 類別 .class {} 範例:使用class名稱為 myCLASS .myCLASS {...} <p class = 'myCLASS'> ID #id {} 範例:id 為 myTEST #myTEST {...} <p id = 'myTEST'> 屬性 [attribute] {} 範例:有使用 class 屬性 [class] {...} <p class = 'test'> 屬性 + 判斷式 (＝) [attribute = "條件"] {} 範例:有使用 class 屬性，而且條件為 myCLASS [class = 'myCLASS'] {...} <p class = 'myCLASS'> <p class = 'myABC'> 不符合 myCLASS 將不會成立 屬性 + 判斷式 (^) [attribute ^= "條件"] {} 範例:有使用 class 屬性，而且開頭為 my [class ^= 'my'] {...} <p class = 'myCLASS'> 開頭為my成立 <p class = 'myABC'>  開頭為my成立 選擇器搭配使用 空格 = 依序包含之內的元素 範例: 設定 classname = "myCLASS" 之後的 table .myCLASS table {} <div class="myCLASS"><table>...</table></div> <table> 不包含在 myCLASS 裡面,將不會成立 逗號 (，) = 多種選擇器並用 範例: 設定 p 及 classname = "myCLA...

SupLDN 計算機 0   0 AC -/+ % / ...

 以下為整合的程式操作,可以使用新增來輸入資料,再由修改來改變資料 其中彈出來的輸入視窗就是前幾章寫的程式,因為是鑲在blogget內,所以版面會整個爆版,如果是在自己的網頁是正常的,有興趣的可以直接檢視原始碼,自行修改 輸出欄位

本章的範例基本上為補完前面的程式碼,接下來要先了解自訂事件以及呼叫的方式 建立自訂事件及監聽 套用原本程式碼 一、建立自訂事件及監聽 以下為建立自訂事件及驅動的程式碼, detail 是保留字 const dialog_ok_event = "dialog_ok_event" ; const Custom_Event = new CustomEvent ( dialog_ok_event ,{ detail :資料(字串) });                     document . dispatchEvent ( Custom_Event ); 監聽接收事件             document . addEventListener (                 dialog_ok_event ,                 function ( e ){                     alert ( "Dialog input:" + e . detail );                 },                 false             ) 二、套用原本程式碼 了解自訂事件後,接下來整合到原來的程式內 先將建立的事件丟到 確認按鈕 內,這樣就可以將產生的資料丟到事件內                             /...

在上一章 Javascript Dialog 自訂輸入視窗 (三) 使用自訂物件產生輸入視窗 已經建立好表單的輸入內容,接下來就要開始建立按鈕以及檢查的步驟,以下為開始建立的步驟 建立輸入按鈕事件 建立取消事件程式碼 建立清除事件程式碼 建立檢查事件程式碼 一、建立輸入按鈕事件 在上一章的程式碼的 CreateInput() 裡面建立了三個按鈕分別為                 strReturn += "<button id = 'dialog_cancel'>取消輸入</button>" ;                 strReturn += "<button id = 'dialog_clear'>清除所有資料</button>" ;                 strReturn += "<button id = 'dialog_ok'>確定</button>" ; 接下來在 CreateDialog() 裡面,建立一個用來放置這三個按鈕處理的 function ,範例取名為 CreateButton () , 接下來就開始將按鈕的事件建立起來             //建立按鈕事件             function CreateButton (){                 //確認                 let dialog_ok = document . getElementById ( "dialog_ok" );             ...

使用 HTML 產生樣式後,接下來就是要使用程式來產生對應的視窗,這時也會用到最一開始先建立起來的物件了  Javascript Dialog 自訂輸入視窗 (一) 建立自訂物件、物件序列化 以下區分兩個步驟 產生基本的輸入視窗 將物件放入產生的輸入視窗 一、產生基本的輸入視窗 延續先前的 HTML 布局,將HTML內的class 先都移除,避免與程式重複會看不出效果,然後加入以下按鈕,可以驅動輸入視窗         < div >             < div id = "mydialog" ></ div >             < button id = "test" > 呼叫輸入視窗 </ button >         </ div > 再來先規劃好 Javascript 要寫的函數,將物件要放入的地方先空出來,程式如下         < script >             //建立輸入視窗             function CreateDialog (){                 let dialog_layout = "" ;                 dialog_layout += "<div class='fullscreen'></div>" ;                 dialog_layout += "<div class='dialog'>" ; ...