signalR消息实时推送 

 1 <!DOCTYPE html>
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 5     <title>SignalR Simple Chat</title>
 6     <style type="text/css">
 7         .container{
 8             background-color:#99ccFF;
 9             border:thick solid #808080;
10             padding:20px;
11             margin:20px;
12         }
13     </style>
14 </head>
15 <body>
16     <div class="container ">
17         <input type="text" id="mm"/>
18         <input type="button" id="gg" value="Send " />
19         <input type="hidden" id="nn" />
20         <ul id="discussion">
21         </ul>
22     </div>
23 
24     <script src="Scripts/jquery-1.7.1.min.js"></script>
25 
26     <script src="Scripts/jquery.signalR-2.2.0.min.js"></script>
27   
28     <script src="/signalr/hubs"></script>
29     <script type="text/javascript">
30         $(function () {
31             // Declare a proxy to reference the hub. 
32             var chat = $.connection.chatHub;
33             // Create a function that the hub can call to broadcast messages.
34             chat.client.broadcastMessage = function (name, message) {
35                 // Html encode display name and message. 
36                 var encodedName = $('<div />').text(name).html();
37                 var encodedMsg = $('<div />').text(message).html();
38                 // Add the message to the page. 
39                 $('#discussion').append('<li><strong>' + encodedName
40                     + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
41             };
42             // Get the user name and store it to prepend to messages.
43             $('#nn').val(prompt('Enter your name:', ''));
44             // Set initial focus to message input box.  
45             $('#mm').focus();
46             // Start the connection.
47             $.connection.hub.start().done(function () {
48                 $('#gg').click(function () {
49                 
50                     // Call the Send method on the hub. 
51                     chat.server.send($('#nn').val(), $('#mm').val());
52                     // Clear text box and reset focus for next comment. 
53                     $('#mm').val('').focus();
54                 });
55             
56             });
57           
58         });
59     </script>
60 </body>
61 </html>
View Code

 

posted on 2015-06-09 17:53  乔丶十三  阅读(235)  评论(1)    收藏  举报

导航