【发布时间】：2015-08-17 17:09:25
【问题描述】：
我正在尝试这样做，以便当 nodejs 在 irc 聊天中触发某些内容时，html 页面（在 *:3000 上运行）将执行一些 JavaScript。当我尝试实现这一点时，它会运行代码但不执行 showDiv();
我在 chrome 中运行它，并打开 localhost:3000。
为什么当我在被拾取的 IRC 中键入 !follow 时，id 为“welcome”的 div 不会变为可见。
完整代码：
Index.html：
<!doctype html>
<html>
<head>
<title>Family Fortunes</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font: 13px Helvetica, Arial; }
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
#messages { list-style-type: none; margin: 0; padding: 0; }
#messages li { padding: 5px 10px; }
#messages li:nth-child(odd) { background: #eee; }
#welcome {display:none;}
</style>
<script>
var socket = io();
function showDiv() {
document.getElementById('welcome').style.display = "visible";
}
</script>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
</head>
<body>
<button onclick="showDiv()">Click me</button>
<div id="welcome"> WELCOME</div>
<script src="/socket.io/socket.io.js"></script>
<script src="example.js"></script>
</body>
</html>
Example.js：
//http://www.schmoopiie.com/docs/twitch-irc/Commands/Action
//SOCKET.IO Setup
var io = require('socket.io')(http);
var app = require('express')();
var http = require('http').Server(app);
io.on('connection', function(socket){
console.log('a user connected');
socket.on('disconnect', function(){
console.log('user disconnected');
});
});
http.listen(3000, function(){
console.log('listening on *:3000');
});
app.get('/', function(req, res){
res.sendfile('index.html');
});
//Node.JS Setup
var irc = require('twitch-irc');
var api = require('twitch-irc-api');
//Declare Global Variable with NO attributes.
var Follower = {};
var LastFollower = {};
//API Callout
setInterval(function(){
api.call({
channel: null,
method: 'GET',
path: '/channels/greatbritishbg/follows',
options: {
limit: 1,
offset: 0
}
}, function(err, statusCode, response) {
if (err) {
console.log(err);
return;
}
Follower.response = String(response.follows[0].user.display_name);
//console.log('Returning Current follower Loop: ' + Follower.response);
});
}, 1000);
//IRC Connect
var clientOptions = {
options: {
debug: true,
debugIgnore: ['ping', 'chat', 'action']
},
identity: {
username: 'greatbritishbg',
password: 'oauth:'
},
channels: ['greatbritishbg']
}
var client = new irc.client(clientOptions);
client.connect();
function showDiv() {
document.getElementById('welcome').style.display = "visible";
}
//Commands
client.addListener('chat', function (channel, user, message) {
console.log(user.username + ': ' + message);
if (message.toLowerCase() === '!follow') {
client.say(channel, 'Latest Follower: ' + Follower.response).then(function() {
showDiv();
});
}
});
【问题讨论】：
-
css中的div是否设置为
visibility: hidden？如果是这样，那么简单地将其显示为一个块将不起作用，因为可见性是隐藏的。 -
所以，嗯...我看不到您在哪里启动套接字服务器，或者侦听来自它的消息或向它发送消息。
-
您是否在“聊天”事件处理程序中设置了断点并检查了消息是否包含您认为的内容？
-
你检查过 dom 检查器中的 div 以查看它的样式属性是否得到更新？
-
Follower来自哪里？
标签： javascript jquery html node.js socket.io