Question

我正在尝试使用NodeJS和Socket.io构建一个聊天室，我已经得到了用户输入并将其发送到节点服务器，但这就是我希望能够在{}中显示它的全部内容。 {1}}

客户端脚本

div

服务器端脚本

var socket = io();

$('form').submit(function(e) {
  e.preventDefault();

  // gets the value from the message text feild and sets it as the message var
  var message = {
    text: $('#chat-box-div-txtinpt').val()
  }
  if (message.text.trim().length !== 0) {
    socket.emit('chat-message', message);
  }
  $('#chat-box-div-txtinpt').focus();
  document.getElementById('chat-box-div-txtinpt').value='';
});

以下是site

Answer 1

看来你正在使用jQuery，所以对于这一行：document.getElementById('chat-box-div-txtinpt').value='';你可以做$('#chat-box-div-txtinpt').val('');

回答你的问题：你可以$('#chatlog-display-div').append(message.text)

您的代码最终会看起来像这样

 $('form').submit(function(e) {
    e.preventDefault();

        //gets the value from the message text feild and sets it as the message var
    var message = {
        text : $('#chat-box-div-txtinpt').val()
    }
    if (message.text.trim().length !== 0) {
      socket.emit('chat-message', message);

      //append the message to the chatlog-display-div
      $('#chatlog-display-div').append(message.text);
    }
    //clear the value of the txtinput after you focus it.
    $('#chat-box-div-txtinpt').focus().val('');
});

如果您认为这足以解决问题，请标记为已接受的答案。

Answer 2

要从服务器向所有人发送消息，请使用emit()

中的io 服务器上的

socket.on('chat-message', function (message) {
   console.log('message : ' + message.text);
   io.emit("chat-message",message);
});

客户

socket.on('chat-message',function(message){
   //add message to the chat window
});

如果您不希望发送邮件的人获得chat-message点击，请使用发送邮件的broadcast.emit()中的socket

//server
socket.on('chat-message', function (message) {
   console.log('message : ' + message.text);
   //excludes "socket" from getting the emit
   socket.broadcast.emit("chat-message",message);
});

要实际将消息放入div中，只需使用jQuery的各种方法html() / text() / append()

//client
socket.on('chat-message', function (message) {
   jQuery(".chat-window").append('<div>'+message.text+'</div>');
});

Answer 3

你可以简单。如果使用ES6，将文本添加到带有模板的“chatlog-display-div”可能类似

$（'form'）。submit（function（e）{ e.preventDefault（）;

<?php

use \Psr\Http\Message\ServerRequestInterface as Request;
use \Psr\Http\Message\ResponseInterface as Response;
use \Slim\App as Slim;

require 'vendor/autoload.php';

$config['determineRouteBeforeAppMiddleware'] = true;

$app = new Slim(['settings' => $config]);

$mw = (function (Request $request, Response $response, callable $next) {
    $response = $response->withStatus(200)->write(' before ');
    $response = $next($request, $response);
    $body = $response->getBody()->__toString();
    $response = $response->withJson(array('data' => $body)); // output should be {"data":" Hello, User  seq1  seq2 "}
    return $response;
});

$mw1 = (function (Request $request, Response $response, callable $next) {
    $response = $next($request, $response);
    $response = $response->withStatus(200)->write(' seq1 ');
    return $response;
});

$mw2 = (function (Request $request, Response $response, callable $next) {
    $response = $next($request, $response);
    $response = $response->withStatus(200)->write(' seq2 ');
    return $response;

});

$app->add($mw);

$app->get('/hello/{name}', function (Request $request, Response $response) {
    $name = $request->getAttribute('name');
    $response->getBody()->write(" Hello, $name ");
    return $response;
})->add($mw1)->add($mw2);

$app->run();

将变量打印到div

3 个答案: