我正在尝试创建一个简单的Io网络聊天。我最近想将<script>我的html文件中的内容分离为一个外部js文件。
这是我非常简单的文件夹结构：
Chat
|-- index.html
|-- index.js
`-- server.js
html文件的相关部分：
<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script src="index.js"></script>
</body>
</html>
index.js文件的相关部分：
$(function() {
//Initialize variables
var $messageArea = $('#messages');
var $InputMessage = $('#InputMessage');
var $InputName = $('#InputName');
//Initialize Socket
var socket = io();
//Send server Your message
socket.emit('chat message', $InputMessage.val());
});
server.js文件的相关部分：
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
});
我还尝试将文件放入socket.io示例中具有的公共类型结构中：
Chat
|-- Public
| |-- index.html
| `-- index.js
`-- server.js
在那种情况下，我更改了：
src="/index.js"在html中添加/public/index.html到server.js文件中，但是没有运气。
这些都在localhost中运行。我在这里做错了什么？
正如标题所暗示的，我想在一页上添加两个模态对话框。我想出了如何创建，但第二个我遇到了麻烦。
HTML：
<body>
<h1>-projects-</h1>
<ul id="button-container">
<li>
<a id="html-modal-button" @click="showModal = true">
<img class="htmllogo" src="images/HTMLLogo.png">
<div class="html-text-block">
<h2>HTML</h2>
<p>My web projects</p>
</div>
</a>
<htmlmodal v-if="showModal" @close="showModal = false"></htmlmodal>
</li>
<li>
<a id="cs-modal-button" @click="showModal = true">
<img class="csharplogo" src="images/CSHARPLogo.png">
<div class="cs-text-block">
<h2>C#</h2>
<p>My windows projects</p>
</div>
</a>
<csmodal v-if="showModal" @close="showModal = false"></csmodal>
</li>
</ul>
<!-- MODAL SECTION -->
<script type="text/x-template" id="html-modal-template">
<transition name="html-modal">
<div class="modal-mask">
<div class="modal-wrapper">
<div class="modal-container">
<div class="modal-header">
<slot name="header">HTML HEADER</slot>
</div>
<div class="modal-body">
<slot name="body">HTML BODY</slot>
</div> …