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操作Cookies包括(读取添加与删除)
Dec 26 Javascript
js简单实现用户注册信息的校验代码
Nov 15 Javascript
利用JS判断用户是否上网(连接网络)
Dec 23 Javascript
checkbox勾选判断代码分析
Jun 11 Javascript
基于jQuery的图片不完全按比例自动缩小
Jul 11 Javascript
兼容各大浏览器的JavaScript阻止事件冒泡代码
Jul 09 Javascript
JSON字符串转换JSONObject和JSONArray的方法
Jun 03 Javascript
[js高手之路]图解javascript的原型(prototype)对象,原型链实例
Aug 28 Javascript
Vue ElementUi同时校验多个表单(巧用new promise)
Jun 06 Javascript
在vue中给列表中的奇数行添加class的实现方法
Sep 05 Javascript
vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例
Mar 08 Javascript
vue的$http的get请求要加上params操作
Nov 12 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实现的递归提成方案实例
2015/11/14 PHP
jquery 操作DOM案例代码分享
2012/04/05 Javascript
javascript简单性能问题及学习笔记
2014/02/04 Javascript
javascript中的取反再取反~~没有意义
2014/04/06 Javascript
一个字符串反转函数可实现字符串倒序
2014/09/15 Javascript
纯JavaScript实现获取onclick、onchange等事件的值
2014/12/29 Javascript
javascript实现动态改变层大小的方法
2015/05/14 Javascript
PHP+jQuery+Ajax+Mysql如何实现发表心情功能
2015/08/06 Javascript
jquery实现简单文字提示效果
2015/12/02 Javascript
JavaScript实现打开链接页面的方式汇总
2016/06/02 Javascript
jQuery Mobile和HTML5开发App推广注册页
2016/11/07 Javascript
JS简单验证上传文件类型的方法
2017/04/17 Javascript
vue实现form表单与table表格的数据关联功能示例
2019/01/29 Javascript
layui form表单提交后实现自动刷新
2019/10/25 Javascript
webpack 动态批量加载文件的实现方法
2020/03/19 Javascript
[01:00:13]完美世界DOTA2联赛 LBZS vs Forest 第一场 11.07
2020/11/09 DOTA
将Emacs打造成强大的Python代码编辑工具
2015/11/20 Python
详解Golang 与python中的字符串反转
2017/07/21 Python
Django REST为文件属性输出完整URL的方法
2017/12/18 Python
Python实现矩阵相乘的三种方法小结
2018/07/26 Python
pyqt5的QWebEngineView 使用模板的方法
2018/08/18 Python
python自动发邮件总结及实例说明【推荐】
2019/05/31 Python
Python自动化运维之Ansible定义主机与组规则操作详解
2019/06/13 Python
Pycharm简单使用教程(入门小结)
2019/07/04 Python
pytorch 输出中间层特征的实例
2019/08/17 Python
Python中itertools的用法详解
2020/02/07 Python
10 套华丽的CSS3 按钮小结
2012/10/03 HTML / CSS
英国袜子店:Sock Shop
2017/01/11 全球购物
会计专业求职信范文
2014/03/16 职场文书
《望庐山瀑布》教学反思
2014/04/22 职场文书
阳光体育活动实施方案
2014/05/25 职场文书
学校教师读书活动总结
2014/07/08 职场文书
村长党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
2014年无财产无子女离婚协议书范本
2014/10/09 职场文书
2014年审计人员工作总结
2014/12/19 职场文书
Redis 配置文件重要属性的具体使用
2021/05/20 Redis