如何用jquery实现页面滚动到指定位置后触发事件的效果

如何用jquery实现页面滚动到指定位置后触发事件的效果,第1张

方法:

$(function() {

$("div_md a")click(function() {

$("html, body")animate({

scrollTop: $($(this)attr("href"))offset()top - 100 + "px"

}, 1500);

return false;

});

//滚动条滚动到指定位置触发下面事件

var getDiv_md = $("div_md");

var offSet = getDiv_mdoffset()top;

$(window)scroll(function(){

if ($(window)scrollTop() > offSet){

$("div_md")css({"position":"fixed","left":"10px","top":"10px","z-index":"2"});

}else{

$("div_md")css({"position":"","left":"0px","top":"","z-index":""});

}

})

});

1、jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。

2、编程工具

Notepad++:一套有特色的自由软件的纯文字编辑器,有完整的中文化接口及支持多国语言编写的功能。它的功能比Windows中的 Notepad(记事本)强大,除了可以用来制作一般的纯文字说明文件,也十分适合当作编写电脑程序的编辑器。Notepad++ 不仅有语法高亮度显示,也有语法折叠功能,并且支持宏以及扩充基本功能的外挂模组。

Brackets:一个免费、开源且跨平台的 HTML/CSS/JavaScript 前端 WEB 集成开发环境 (IDE工具)。该项目由 Adobe 创建和维护,根据MIT许可证发布,支持Windows、Linux平台。Brackets的特点是简约、优雅、快捷,它的核心目标是减少在开发过程中那些效率低下的重复性工作,例如浏览器刷新,修改元素的样式,搜索功能等等。

JS Nice:一款让经过混淆处理的JavaScript代码可读更好的工具。它使用一种用于JavaScript代码美化的去混淆和去压缩引擎。JSNice采用先进的机器学习和程序分析技术,从可用的开源项目学习命名和类型规律。

我是想做这样的 *** 作

elementonclick=function(e){

02020202 回车事件;

//在这里自动触发一次回车,相当于做了一个单击 *** 作后,用户按了回车键,其实用户没有按回车

02020202 其他处理}02问题补充:

1 $(elem)keydown(function(event){

2 if(eventkeyCode==13){

3 //doSth

4 }

不知道大家明不明白我的意思问题补充:我这个需求是在jqgrid的工具条中使用的,增加了一个按钮,按钮事件如下:

onClickButton:function(){

//因为在编辑grid cell的时候,如果不按回车,或者焦点离开正在编辑的

//cell,jqgrid认为这一个cell 没有被修改过,所以在这里我想触发一个回车事件

//使焦点所在的cell变成已编辑状态,这样下面的cc中才能获取到完整的修改过的//cell

//在此处增加自动触发回车,而非用户按回车键

var cc = jQuery("#info")getChangedCells();//获取所有修改过的cell

if(cclength <=0){

alert('没有修改的数据');

jQueryajax({});//这几做一个ajax提交数据,实现就不写了}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN" ";

------jQuery为所有Radio绑定change事件

jquery就不用children了吧,直接用:

alert($(this)parent()parent()find("td:eq(0)")text());

对了,你这个 $(this) 要确定是这个 input 哦。

$("input[name='del']")each(function(){

alert($(this)parent()parent()find("td:eq(0)")text());

})

// 那除非你的tr里面有隐藏的列,你可以使用

alert($(this)parent()parent()html());

// 看一下是不是 <tr><td></td><td>item</td><td>111</td><td><input /></td></tr>

常用模拟

有时候,需要通过模拟用户 *** 作,来达到单击的效果。例如在用户进入页面后,就触发click事件,而不需要用户去主动单击。

在JQuery中,可以使用trigger()方法完成模拟 *** 作。例如可以使用下面的代码来触发id为btn的按钮的click事件。

1 $('#btn')trigger("click");

这样,当页面加载完毕后,就会立刻输出想要的效果。也可以直接简写click(),来达到同样的效果:

1 $('#btn')click();

触发自定义事件

trigger()方法不仅能触发浏览器支持的具有相同名称的事件,也可以触发自定义名称的事件。例如为元素绑定一个“myClick”的事件,JQuery代码如下:

1 $('#btn')bind("myClick", function(){

2 $('#test')append("<p>我的自定义事件</p>");

3 });

以上就是关于如何用jquery实现页面滚动到指定位置后触发事件的效果全部的内容,包括:如何用jquery实现页面滚动到指定位置后触发事件的效果、jquery如何触发回车事件、怎样使用jQuery触发Select,Radio的change/onchange事件等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9745366.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-01
下一篇 2023-05-01

发表评论

登录后才能评论

评论列表(0条)

保存