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 写类方式之三
Jul 05 Javascript
25个好玩的JavaScript小游戏分享
Apr 22 Javascript
jQuery中filter()方法用法实例
Jan 06 Javascript
jquery实现华丽的可折角广告代码
Sep 02 Javascript
微信小程序 122100版本更新问题解决方案
Dec 22 Javascript
详解如何在nuxt中添加proxyTable代理
Aug 10 Javascript
使用vue2.0创建的项目的步骤方法
Sep 25 Javascript
在Vue中用canvas实现二维码和图片合成海报的方法
Jun 10 Javascript
Vue CLI项目 axios模块前后端交互的使用(类似ajax提交)
Sep 01 Javascript
vue中@change兼容问题详解
Oct 25 Javascript
从0搭建vue-cli4脚手架
Jun 17 Javascript
vuecli项目构建SSR服务端渲染的实现
Oct 30 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
不用数据库的多用户文件自由上传投票系统(2)
2006/10/09 PHP
php 注释规范
2012/03/29 PHP
php下获取http状态的实现代码
2014/05/09 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
Javascript 各浏览器的 Javascript 效率对比
2008/01/23 Javascript
JavaScript 打地鼠游戏代码说明
2010/10/12 Javascript
jquery ajax 简单范例(界面+后台)
2013/11/19 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
AngularJS语法详解
2015/01/23 Javascript
jQuery实现点击小图显示大图代码分享
2015/08/25 Javascript
js时间比较 js计算时间差的简单实现方法
2016/08/26 Javascript
利用bootstrapValidator验证UEditor
2016/09/14 Javascript
Angular排序实例详解
2017/06/28 Javascript
jquery实现图片跟随鼠标的实例
2017/10/17 jQuery
python爬取安居客二手房网站数据(实例讲解)
2017/10/19 Javascript
Servlet3.0与纯javascript通过Ajax交互的实例详解
2018/03/18 Javascript
Linux Centos7.2下安装nodejs&amp;npm配置全局路径的教程
2018/05/15 NodeJs
原生JS实现DOM加载完成马上执行JS代码的方法
2018/09/07 Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
2018/10/18 Javascript
python3访问sina首页中文的处理方法
2014/02/24 Python
Python 安装setuptools和pip工具操作方法(必看)
2017/05/22 Python
Python基于csv模块实现读取与写入csv数据的方法
2018/01/18 Python
python批量下载网站马拉松照片的完整步骤
2018/12/05 Python
python flask搭建web应用教程
2019/11/19 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
Python设计密码强度校验程序
2020/07/30 Python
美国最好的保健品打折网店:Swanson
2017/08/04 全球购物
印度在线杂货店:bigbasket
2018/08/23 全球购物
365 Tickets英国:全球景点门票
2019/07/06 全球购物
热能动力工程毕业生自荐信
2013/11/07 职场文书
法制宣传月活动总结
2014/04/29 职场文书
2014年扶贫帮困工作总结
2014/12/09 职场文书
2014年法务工作总结
2014/12/11 职场文书
2014年高二班主任工作总结
2014/12/16 职场文书
高校自主招生自荐信2015
2015/03/04 职场文书
golang操作redis的客户端包有多个比如redigo、go-redis
2022/04/14 Golang