jquery应该如何来设置改变按钮input的onclick事件


Posted in Javascript onDecember 10, 2012

jquery应该如何来设置按钮input的onclick事件?比如开始时有个按钮: <input id=”prebt” type=”button” value=”上一页” onclick=”ToPage(2)”/>这行代码是在程序后台生成的,和Discuz!NT论坛源码中的做法一样,页面上所有的东西连同脚本都是由后台代码生成..然后用jquery.ajax加载到页面上来..其他的除了ie8不能显示之外..其它浏览器都正常.现在的问题是:要动态改变这个上一页按钮中onclick的函数.我自己是尝试了很多种方法,都没有做出来,下面列举的几个都是失败的例子:
1.JavaScript code:

$(“#prebt”).unbind(“onclick”,function(){var p= $(“#nextbt”).parent();$(“#nextbt”).remove(); 
p.append(“<input id=\”nextbt\” type=\”button\” value=\”编辑\” onclick=\”ToPage(14)\”/>”)}); 
JavaScript code: 
$(“#prebt”).removeAttr(“onclick”); 
$(“#prebt”).attr(“onclick”,”ToPage(4)”); 
或者: 
$(“#prebt”).attr(“onclick”,”"); 
$(“#prebt”).attr(“onclick”,”ToPage(4)”);

2.JavaScript code:
$(“#prebt”).removeAttr(“onclick”); 
$(“#prebt”).click(function(){ToPage(4)}); //此句会导致死循环..不知是怎么回事.. 
//我做的分页功能…这样写导致数据一直在乱跳,应该怎样来解决呢?

实在是没有办法了,只能是在网上发布了相关的请求,有朋友问我,是否我要的效果就如下面的:
$(“#prebt”).unbind(“onclick”); 
$(“#prebt”).bind(“onclick”,”ToPage(4)”);

其实我要的效果就是跟上面的一样的,但是上面的方法跟我原本的效果是差不多的,也是没办法执行,而且根本都绑定不上去.
又有热心的网友给了一个我代码例子,说是对我有帮助,如下的细节:
XML/HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>无标题文档</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script type="text/javascript"> 
//<![CDATA[ 
function toPage(id){alert(id);} 
$(function(){ 
$('#btndemo').removeAttr('onclick').unbind('click').click(function(){ 
toPage(1); 
}) 
}) 
//]]> 
</script> 
</head> 
<body> 
<input id="btndemo" type="button" value="click" onclick="toPage(4)" /> 
</body> 
</html>

以上在ie8中测试时,单击时候结果为1,即使是这样,但是还不是我原本所想要的效果。难道是真的没有方法可以实现了吗?
最终我还是自己给想出了一个比较笨的方法,可以实现的,如下:
<span id=”prespan”><input id=”prebt” type=”button” value=”上一页” onclick=”ToPage(2)”/></span>

然后后台程序自自动把prespan中的内容替换掉.
$(‘#prespan').empty(); 
$(‘#prespan').append(“<input id=\”prebt\” type=\”button\” value=\”上一页\” onclick=”\ToPage(4)\”/>”);

虽然没有用到设置onclick.但最后还是解决了我的难题。
Javascript 相关文章推荐
JS 对象介绍
Jan 20 Javascript
javascript中将Object转换为String函数代码 (json str)
Apr 29 Javascript
JavaScript中“+”的陷阱深刻理解
Dec 04 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
Jun 04 Javascript
javascript实现带节日和农历的日历特效
Feb 01 Javascript
ANGULARJS中使用JQUERY分页控件
Sep 16 Javascript
javascript检测flash插件是否被禁用的方法
Jan 14 Javascript
浅析JS动态创建元素【两种方法】
Apr 20 Javascript
详细AngularJs4的图片剪裁组件的实例
Jul 12 Javascript
Puppet的一些技巧
Sep 17 Javascript
解决layui 表单元素radio不显示渲染的问题
Sep 04 Javascript
为nuxt项目写一个面包屑cli工具实现自动生成页面与面包屑配置
Sep 29 Javascript
JQuery拖拽元素改变大小尺寸实现代码
Dec 10 #Javascript
十个迅速提升JQuery性能让你的JQuery跑得更快
Dec 10 #Javascript
JQuery each()函数如何优化循环DOM结构的性能
Dec 10 #Javascript
jquery的$getjson调用并获取远程的JSON字符串问题
Dec 10 #Javascript
如何用ajax来创建一个XMLHttpRequest对象
Dec 10 #Javascript
iframe 上下滚动条如何默认在下方实现原理
Dec 10 #Javascript
Ajax执行顺序流程及回调问题分析
Dec 10 #Javascript
You might like
PHP中feof()函数实例测试
2014/08/23 PHP
Laravel框架表单验证详解
2014/09/04 PHP
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
js兼容火狐获取图片宽和高的方法
2015/05/21 Javascript
JQuery统计input和textarea文字输入数量(代码分享)
2016/12/29 Javascript
JavaScript实现定时页面跳转功能示例
2017/02/14 Javascript
Vue动态组件实例解析
2017/08/20 Javascript
详解Vue-cli代理解决跨域问题
2017/09/27 Javascript
从源码看angular/material2 中 dialog模块的实现方法
2017/10/18 Javascript
详解js跨域请求的两种方式,支持post请求
2018/05/05 Javascript
vue搜索和vue模糊搜索代码实例
2019/05/07 Javascript
浅析TypeScript 命名空间
2020/03/19 Javascript
Vue 实现对quill-editor组件中的工具栏添加title
2020/08/03 Javascript
Python程序设计入门(4)模块和包
2014/06/16 Python
改进Django中的表单的简单方法
2015/07/17 Python
Python编程中装饰器的使用示例解析
2016/06/20 Python
python下如何查询CS反恐精英的服务器信息
2017/01/17 Python
Python列表和元组的定义与使用操作示例
2017/07/26 Python
浅析PHP与Python进行数据交互
2018/05/15 Python
不管你的Python报什么错,用这个模块就能正常运行
2018/09/14 Python
python 调用有道api接口的方法
2019/01/03 Python
Python 通过微信控制实现app定位发送到个人服务器再转发微信服务器接收位置信息
2019/08/05 Python
关于Tensorflow使用CPU报错的解决方式
2020/02/05 Python
运行python提示no module named sklearn的解决方法
2020/11/29 Python
Python实现Appium端口检测与释放的实现
2020/12/31 Python
H5页面适配iPhoneX(就是那么简单)
2019/12/02 HTML / CSS
耐克美国官网:Nike.com
2016/08/01 全球购物
高清安全摄像头系统:Lorex Technology
2018/07/20 全球购物
医院护理人员的自我评价分享
2013/10/04 职场文书
幼教毕业生自我鉴定
2014/01/12 职场文书
派出所所长先进事迹
2014/05/19 职场文书
应届生求职信范文
2014/06/30 职场文书
2014年政府采购工作总结
2014/12/09 职场文书
请学会珍惜眼前,因为人生没有下辈子!
2019/11/12 职场文书
Python数组变形的几种实现方法
2022/05/30 Python
MySQL常用慢查询分析工具详解
2022/08/14 MySQL