[英]Javascript onClick event not firing
我正在尝试使用Javascript来控制Web表单。 这是我的所有Javascript代码以及我想要实现的内容。
$(document).ready(function(){
function loadPage(url){
$(".body").fadeOut(400, function(){
$(".body").load(url);
$(".body").fadeIn(400);
});
}
loadPage("pages/login.html");
$("#button").on("click", function(){
var pageTo = this.name;
loadPage("pages/" + pageTo + ".html");
});
});
代码将在稍后执行更复杂的操作,但它甚至不会执行上述操作。
我的表格看起来像这样
<FORM>
<SPAN class='header'>Login</SPAN><BR/>
<LABEL for='username' class='loginLabel'>Username</LABEL>
<INPUT type='text' id='username' name='username' value='' />
<LABEL for='password'class='loginLabel'>Password</LABEL>
<INPUT type='password' id='password' name='password' value='' />
<INPUT type='hidden' name='process' value='login' />
<INPUT type='button' value='Login' name='index' id='button' />
</FORM>
它是一个简单的登录表单,但单击按钮时文本不会显示在控制台中。 我不想使用提交按钮和JQuery .submit()事件,因为我希望相同的代码可以处理多种类型的事物,包括链接和可能的其他元素。
您正试图在页面中存在元素之前绑定事件处理程序。
通过将回调传递给.load
来添加表单后绑定处理程序:
$(document).ready(function(){
function loadPage(url){
$(".body").fadeOut(400, function(){
$(".body").load(url, function() {
$("#button").on("click", function(){
var pageTo = this.name;
loadPage("pages/" + pageTo + ".html");
});
});
$(".body").fadeIn(400);
});
}
loadPage("pages/login.html");
});
或使用事件委托(请参阅文档中的直接和委派事件部分):
$(document).on("click", "#button", function(){
var pageTo = this.name;
loadPage("pages/" + pageTo + ".html");
});
这不是正确的方法,用jquery注册一个处理程序...
尝试
$('#button').click(function(){
console.log('test');
});
$("#button")
返回一个没有onclick
属性/方法的jQuery对象。 使用.click
:
$('#button').click(function() {
});
试试.on
$("#button").on('click', function(){
console.log("Clicked");
});
这不是onclick
它的click
$("#button").click();
在将onclick行为分配给按钮之前,您确定要等待加载文档吗? 尝试将作业更改为内部
$(document).ready(function(...))
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.