JQuery按鈕沒有觸發，javascript沒有提示ASP.NET SignalR聊天應用程序

Question

我想在用戶之間的ASP.NET解決方案上創建一個聊天應用程序。安裝SignalR以幫助實時聊天。然而，使用JavaScript創建的按鈕不會觸發，瀏覽器也不會提示輸入用戶名，因爲它是假設的。以下是我的代碼。 Check out the design here

C＃代碼隱藏

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using Microsoft.AspNet.SignalR; 

namespace Synergince 
{ 
//below is a class to handle the username and message entered by the username 
public class ChatHub : Hub 
{ 
    public void Send(string name, string message) 
    { 
     //call the broadcast method to update clients 
     Clients.All.broadcastMessage(name, message); 
    } 
} 

}

源代碼 - JavaScript的

<div class="container"> 
<input type="text" id="message" /> 
<input type="button" id="sendmessage" value="Send" /> 
<input type="hidden"id="displayname" /> 
<ul id="discussion"> 
</ul> 
</div> 

<!--Script references --> 
<script src="Scripts/jquery-1.4.1.min.js"></script> 
<script src="Scripts/jquery.signalR-1.2.1.js"></script> 
<script src="/signalr/hubs"></script> 
<script type="text/javascript""> 
    $(on('click',function() { 
     var chat = $.connection.chatHub; 
     chat.client.broadcastMessage = function (name, message) { 
      var Name = $('<div />').text(name).html(); 
      var Msg = $('<div />').text(message).html(); 

      //add message to the page 
      $('#discussion').append('<li><strong>' + encodedName + '</strong>:&nbsp;&nbsp;' + encodeMsg + '</li>'); 
     }; 

     //get username from user 
     $('#displayname').val(prompt('Enter preffered alias:', '')); 
     $('#message').focus(); 

     //start connection 
     $.connection.hub.start().done(function() { 
      $('#sendmessage').click(function() { 

       //call send method on the hub 
       chat.server.send($('#displayname').val(), $('#message').val()); 

       //clear textbox 
       $('#message').val('').focus(); 

      }); 

     }); 

    }); 

</script> 

Answer 1

儘量特異性結合它在你綁定你的處理程序之前確保那個按鈕並確保the document is ready。如果文檔尚未準備好，您的點擊處理程序將不會激活。

$(document).ready(function() { 
 
     $('#sendmessage').on('click', function() { 
 
     console.log('test'); 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="button" value="test" id="sendmessage"/>