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变量作用域及可访问性的探讨
Nov 23 Javascript
javascript onkeydown,onkeyup,onkeypress,onclick,ondblclick
Feb 04 Javascript
JavaScript中:表达式和语句的区别[译]
Sep 17 Javascript
Dom 学习总结以及实例的使用介绍
Apr 24 Javascript
禁用键盘上的(全局)指定键兼容iE、Chrome、火狐
May 14 Javascript
js实现下拉框二级联动
Dec 04 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
May 26 Javascript
vue实现一拉到底的滑动验证
Jul 25 Javascript
vue 获取视频时长的实例代码
Aug 20 Javascript
在vue中利用v-html按分号将文本换行的例子
Nov 14 Javascript
JavaScript中的函数申明、函数表达式、箭头函数
Dec 06 Javascript
JS实现选项卡插件的两种写法(jQuery和class)
Dec 30 jQuery
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
终于听上了直流胆调频
2021/03/02 无线电
php+mysql实现数据库随机重排实例
2014/10/17 PHP
php通过rmdir删除目录的简单用法
2015/03/18 PHP
PHP中include和require的区别实例分析
2017/05/07 PHP
php面试中关于面向对象的相关问题
2019/02/13 PHP
js注意img图片的onerror事件的分析
2011/01/01 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
JavaScript中使用自然对数ln的方法
2015/06/14 Javascript
Javascript中的几种继承方式对比分析
2016/03/22 Javascript
pc加载更多功能和移动端下拉刷新加载数据
2016/11/07 Javascript
使用base64对图片的二进制进行编码并用ajax进行显示
2017/01/03 Javascript
详解在 Angular 项目中添加 clean-blog 模板
2017/07/04 Javascript
AngualrJs清除定时器遇到的坑
2017/10/13 Javascript
vue 挂载路由到头部导航的方法
2017/11/13 Javascript
详解webpack import()动态加载模块踩坑
2018/07/17 Javascript
Vue下拉框回显并默认选中随机问题
2018/09/06 Javascript
浅谈小程序 setData学问多
2019/02/20 Javascript
js判断一个对象是数组(函数)的方法实例
2019/12/19 Javascript
express异步函数异常捕获示例详解
2020/11/30 Javascript
[05:14]辉夜杯主赛事第二日 RECAP精彩回顾
2015/12/27 DOTA
Python读写文件方法总结
2015/06/09 Python
python django事务transaction源码分析详解
2017/03/17 Python
浅谈Python实现贪心算法与活动安排问题
2017/12/19 Python
Win系统PyQt5安装和使用教程
2019/12/25 Python
python pprint模块中print()和pprint()两者的区别
2020/02/10 Python
Python坐标轴操作及设置代码实例
2020/06/04 Python
Html5剪切板功能的实现代码
2018/06/29 HTML / CSS
英国男士时尚购物网站:Stuarts London
2017/10/22 全球购物
Nordgreen台湾官网:极简北欧设计手表
2019/08/21 全球购物
德国在线香料制造商:Gewürzland
2020/03/10 全球购物
教师师德反思材料
2014/02/15 职场文书
毕业设计论文致谢词
2015/05/14 职场文书
户外拓展训练感想
2015/08/07 职场文书
python中24小时制转换为12小时制的方法
2021/06/18 Python
python实现简易自习室座位预约系统
2021/06/30 Python
Redis特殊数据类型bitmap位图
2022/06/01 Redis