
在网页加载完成时,通过js获取和添加点击的识别方式
- (void)webViewDidFinishLoad:(UIWebView )webView {
[IDProgressHUD IDPlaceViewHideDirect:selfview];
//这里是js,主要目的实现对url的获取
static NSString const jsGetImages =
@"function getImages(){\
var objs = documentgetElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i<objslength;i++){\
imgScr = imgScr + objs[i]src + '+';\
};\
return imgScr;\
};";
[webView stringByEvaluatingJavaScriptFromString:jsGetImages];//注入js方法
NSString urlResurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"];
mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]];
if (mUrlArraycount >= 2) {
[mUrlArray removeLastObject];
}
//urlResurlt 就是获取到得所有的url的拼接;mUrlArray就是所有Url的数组
//添加可点击js
[mWebView stringByEvaluatingJavaScriptFromString:@"function registerImageClickAction(){\
var imgs=documentgetElementsByTagName('img');\
var length=imgslength;\
for(var i=0;i<length;i++){\
img=imgs[i];\
imgonclick=function(){\
windowlocationhref='image-preview:'+thissrc}\
}\
}"];
[mWebView stringByEvaluatingJavaScriptFromString:@"registerImageClickAction();"];
}
//在这个方法中捕获到的点击事件和被点击的url
- (BOOL)webView:(UIWebView )webView shouldStartLoadWithRequest:(NSURLRequest )request navigationType:(UIWebViewNavigationType)navigationType {
//预览
if ([requestURLscheme isEqualToString:@"image-preview"]) {
NSString path = [requestURLabsoluteString substringFromIndex:[@"image-preview:" length]];
path = [path stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
//path 就是被点击的url
return NO;
}
return YES;
}
在给标签绑定事件时在回调事件里有一个event参数,可以通过eventtarget获取当前对象,在处理函数里把当前对象当做参数传递过去。如:
//绑定事件$('list')click(function(event){
var ele=eventtarget;
deal(ele);
});
//处理函数
function deal(obj){
}
只是举一个例子,如果有错误,请指出。
在各种浏览器中存在三种事件模型:原始事件模型,DOM2事件模型,IE事件模型。
其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE以外的所有主流浏览器支持
原始事件模型:
在原始事件模型中(也有说DOM0级),事件发生后没有传播的概念,没有事件流。北大青鸟认为事件发生,处理,结束,就这么简单。监听函数只是元素的一个属性值,通过指定元素的属性值来绑定监听器。书写方式有两种:
(1)HTML代码中指定属性值:
(2)在js代码中指定属性值:documentgetElementsByTagName(‘input’)[0]onclick=func
优点:所有浏览器都兼容
缺点:
1逻辑与显示没有分离
2相同事件的监听函数只能绑定一个,后绑定的会覆盖掉前面的
3无法通过事件的冒泡、委托等机制。
DOM2事件模型
此模型是W3C制定的标准模型。W3C制定的事件模型中,一次事件的发生包含三个过程:
(1)事件捕获阶段。事件被从document一直向下传播到目标元素,在这过程中依次检查经过的节点是否注册了该事件的监听函数,若有则执行。
(2)事件处理阶段。事件到达目标元素,执行目标元素的事件处理函数
(3)事件冒泡阶段。事件从目标元素上升一直到达document,同样依次检查经过的节点是否注册了该事件的监听函数,有则执行。
所有的事件类型都会经历"事件捕获阶段"但是只有部分事件会经历"事件冒泡阶段"阶段,例如submit事件就不会被冒泡。
etarget与ecurrentTarget是干什么的
etarget获取当前实际触发事件节点,ecurrentTarget获取获取当前监听节点。
11111
$('div')on('click',function(e){consolelog(ecurrentTarget);consolelog(etarget);})
如果点击span的输出:
li对象
span对象
点击li的非span区域,输出
li对象
li对象
preventDefault与stopPropagation是干什么的
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 401//EN" ";
效果如图:
以上就是关于如何通过js获取网页中所有图片并加入点击事件,实现全部的内容,包括:如何通过js获取网页中所有图片并加入点击事件,实现、js中如何通过单击事件获取当前对象,并传递、js代码事件机制识别等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)