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 相关文章推荐
javascript Math.random()随机数函数
Nov 04 Javascript
location.href语句与火狐不兼容的问题
Jul 04 Javascript
深入理解javascript作用域和闭包
Sep 23 Javascript
jquery常用函数与方法汇总
Sep 01 Javascript
深入解析JavaScript中的数字对象与字符串对象
Oct 21 Javascript
Jquery Easyui日历组件Calender使用详解(23)
Dec 18 Javascript
JS拉起或下载app的实现代码
Feb 22 Javascript
js正则表达式验证表单【完整版】
Mar 06 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
May 17 Javascript
详解django模板与vue.js冲突问题
Jul 07 Javascript
vue+elementUI 实现内容区域高度自适应的示例
Sep 26 Javascript
antd table按表格里的日期去排序操作
Nov 17 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
smarty模板判断数组为空的方法
2015/06/10 PHP
golang、python、php、c++、c、java、Nodejs性能对比
2017/03/12 NodeJs
PDO操作MySQL的基础教程(推荐)
2017/08/18 PHP
动态刷新 dorado树的js代码
2009/06/12 Javascript
jQuery中delegate与on的用法与区别示例介绍
2013/12/20 Javascript
JS中判断JSON数据是否存在某字段的方法
2014/03/07 Javascript
写出高效jquery代码的19条指南
2014/03/19 Javascript
jQuery学习笔记之jQuery原型属性和方法
2014/06/09 Javascript
详解JavaScript中数组和字符串的lastIndexOf()方法使用
2016/03/13 Javascript
Mvc提交表单的四种方法全程详解
2016/08/10 Javascript
红黑树的插入详解及Javascript实现方法示例
2018/03/26 Javascript
QQ跳转支付宝并自动领红包脚本(最新)
2018/06/22 Javascript
「中高级前端面试」JavaScript手写代码无敌秘籍(推荐)
2019/04/08 Javascript
我要点爆”微信小程序云开发之项目建立与我的页面功能实现
2019/05/26 Javascript
微信公众号平台接口开发 获取微信服务器IP地址方法解析
2019/08/14 Javascript
[01:21:07]EG vs Liquid 2018国际邀请赛淘汰赛BO3 第一场 8.25
2018/08/29 DOTA
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
Python实现的快速排序算法详解
2017/08/01 Python
python爬虫之xpath的基本使用详解
2018/04/18 Python
Python 常用模块 re 使用方法详解
2019/06/06 Python
Python enumerate内置库用法解析
2020/02/24 Python
Python中的wordcloud库安装问题及解决方法
2020/05/27 Python
python查询MySQL将数据写入Excel
2020/10/29 Python
HTML块级标签汇总(小篇)
2016/07/13 HTML / CSS
使用phonegap创建联系人的实现方法
2017/03/30 HTML / CSS
WoolOvers澳洲官方网站:英国针织服装公司
2018/05/13 全球购物
银行开业庆典方案
2014/02/06 职场文书
城市精细化管理实施方案
2014/03/04 职场文书
保密工作整改情况汇报
2014/11/06 职场文书
论群众路线学习笔记
2014/11/06 职场文书
行政人事主管岗位职责
2015/04/11 职场文书
中学感恩教育活动总结
2015/05/05 职场文书
2015年学校管理工作总结
2015/07/20 职场文书
幼儿园大班开学寄语(2016秋季)
2015/12/03 职场文书
MYSQL如何查看进程和kill进程
2022/03/13 MySQL
VW、VH适配移动端的解决方案与常见问题
2023/05/21 HTML / CSS