javascript原生代码实现页面查找功能
由于是需在多框架页面中进行搜索,所以先从搜索顺序从左—右。
<input type="button" value="搜 索" onclick="findText(txtFind.value)" style="width:70px;height:28px;font-weight: bold;">
<script language="javascript">
var rng="";
var iframe_next="";
var frame_target=window.parent.document.frames.left_iframe; //默认先搜索左框架
function findText(str){
try{
if(str==""){
alert("请输入搜索的关键字");
return;
}
if(rng.findText(str)){ //若找到,则反白关键字
rng.select();
rng.collapse(false); //迫使开始点移动第一个匹配的范围的结束点
}else{ //否则判断左右框架搜索跳转
if (iframe_next=="right"){ //若当前为右框架,则弹出完成对话框并准备下一步搜索左框架
alert("搜索完毕");
iframe_next="left";
frame_target=window.parent.document.frames.left_iframe;
rng = frame_target.document.body.createTextRange();
}else{ //若当前为左框架,则下一步搜索右框架
iframe_next="right"
frame_target=window.parent.document.frames.right_iframe;
rng = frame_target.document.body.createTextRange();
findText(str);
}
}
}
catch(err){ //由于搜索框放在页面顶部,所以第一次createTextRange会出错,catch里赋值即可。
rng=window.parent.document.frames.left_iframe.document.body.createTextRange();
findText(str);
}
}
</script>
参考资源:
javascript moveStart和moveEnd方法(TextRange对象--查找与选择)
http://hi.baidu.com/mascotdai/blog/item/2538030e979e56c27bcbe1f5.html
用javascript获得参数/编辑SELECT/设置光标位置/页内查找
http://hi.baidu.com/jhfcjl/blog/item/4ceaafec7cadcf4878f05587.html
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
http TRACE 跨站攻击漏洞测试与防御修复
http TRACE 跨站攻击漏洞测试与防御修复 apache关闭方法可以直接在配置文件http.conf添加TraceEnable off 关闭 有版本要求 好像是2.0以上 在httpd.conf下搜索Global 在 ### Section 1: Global Environment 下面加 TraceEnable off 保存OK 如何测试呢.这样 在cmd下输入 telnet 127.0.0.1 80 然后在黑屏状态下输入 TRACE / HTTP/1.0 Host: foo 在添加TraceEnable off之前,应返回 HTTP/1.1 200 OK Date: Sat, 20 Oct 2007 20:39:36 GMT Server: Apache/2.2.6 (Debian) PHP/4.4.4-9 mod_ruby/1.2.6 Ruby/1.8.6(2007-06-07) Connection: close Content-Type: message/http TRACE / HTTP/1.0 Host: foo Any text entered here wil...
- 下一篇
一个C#程序员学习微信小程序的笔记
一个C#程序员学习微信小程序的笔记 客户端打开小程序的时候,就将代码包下载到本地进行解析,首先找到了根目录的app.json,知道了小程序的所有页面。 在这个Index页面就是我们的首页,客户端在启动的时候,将首页的代码装载进来,通过微信的机制,就渲染出来了页面。 App({ onLaunch() { // 小程序启动之后 触发 } }) 小程序在启动的时候,首先通过App()定义的App()实例的onLaunch方法,这个方法是各个页面共享的,当然还有更多的回调事件。 Page({ data: { text: 'init data', array: [{msg: '1'}, {msg: '2'}] } }) 在页面加载时,data这个属性会提供给页面使用,会以Json的形式返回给前端,然后我们可以试着把这个值渲染在页面上。 <view>{{text}}</view> <view>{{array[0].msg}}</view> 小程序页面中还有很多的方法,像onReady()当页面加载妥当,可以进行交互的时候触发,还有小程序被切入后台的O...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- CentOS关闭SELinux安全模块
- SpringBoot2整合Redis,开启缓存,提高访问速度
- Windows10,CentOS7,CentOS8安装Nodejs环境
- Red5直播服务器,属于Java语言的直播服务器
- CentOS6,CentOS7官方镜像安装Oracle11G
- Springboot2将连接池hikari替换为druid,体验最强大的数据库连接池
- CentOS7编译安装Gcc9.2.0,解决mysql等软件编译问题
- SpringBoot2整合Thymeleaf,官方推荐html解决方案
- CentOS7安装Docker,走上虚拟化容器引擎之路
- Jdk安装(Linux,MacOS,Windows),包含三大操作系统的最全安装