我还是javascript的新手。
我的应用程序在页面上有两个按钮。一个是显示一个游戏的cpu_vs_player按钮,另一个是显示不同游戏的player_vs_player按钮。问题是所有代码都位于一个application.js文件中。如果我要玩cpu_vs_player,则无需在$(document).ready(function(){});
上加载player_vs_player。
关于如何在我选择游戏时如何才能加载它们的任何想法? (我只使用一条路线,根据点击隐藏/显示所有信息)。
答案 0 :(得分:4)
document.ready只不过是页面渲染后的那一刻,文档需要用事件监听器填充。坦率地说,这种猫的皮肤有多种方式。
你可以使用jQuery方式保持javascript和HTML分开:
<button id="button1">cpu_vs_player</button>
<button id="button2">player_vs_player</button>
对于JavaScript:
假设你有每个游戏玩法的功能:
function cpu_vs_player() {
// start the game
}
function player_vs_player() {
// need another player
}
以jQuery方式添加事件侦听器:
$(document).ready(function() {
$("#button1").click(function() {
cpu_vs_player();
});
$("#button1").click(function() {
player_vs_player();
});
});
或您可以使用@Techstone显示的方法,但您可以更直接地执行此操作。这一切都有效。
<button onclick="javascript:cpu_vs_player();">cpu_vs_player</button>
<button onclick="javascript:player_vs_player();">player_vs_player</button>
添加另一个可以申请的选项
在Javascript中:
var Main = {
cpu_vs_player: function() {
alert("start cpu_vs_player");
},
player_vs_player: function() {
alert("start player_vs_player");
}
}
在您的HTML中:
<button onclick="javascript:Main.cpu_vs_player();">cpu_vs_player</button>
<button onclick="javascript:Main.player_vs_player();">player_vs_player</button>
是的,还有更多...; - )
答案 1 :(得分:2)
你的两个按钮和js定义的图像如下
function LetsRock(Playmate) {
....
}
<input type='button' value='cpu_vs_player' id='cpu_vs_player' onclick='javascript:LetsRock(this.id);' />
<input type='button' value='player_vs_player' id='player_vs_player' onclick='javascript:LetsRock(this.id);' />
答案 2 :(得分:1)
尝试使用带参数的函数(即0到cpu v / s播放器,1到播放器v / s播放器),然后从菜单页面发送到$(document).ready(function(){});