javascript – div onclick or oncontext is working only one time after webview load in cocoa-ThrowExceptions

Exception or error:

Currently, I am working on mac OS X cocoa application.
I am making one application using a web view. In my demo app, I have set two buttons and one webview. Both buttons load the same file. The first time I get clicked div id, but after the second time load of the web view, I am not getting div id. I am using web-kit for interface method to call an obj-c method from javascript. I have applied many solutions but I am not able to track its an issue. Please give me a solution as soon as possible.here is the screenshot which displays clicked div id in console first time

I have used below code for web view implementation

<body>
    <div class="xxx">
        <table class="xxx">
            <tr>
                <td class="xxx"><img alt="userimg" src="sdfasdf.jpg" /></td>
                <td>
                    <div class="xxx">
                        <div class="xxx">
                            <div class="msg" id="1" onClick="window.objcConnector.MsgDivClicked_(this.id)">Hiiiiiiiii</div>
                        </div>
                        <div class="xxx">
                            <div class="xxx" id="2" onClick="window.objcConnector.MsgDivClicked_(this.id)">Heyy</div>
                        </div>
                        <div class="xxx">
                            <div class="xxx" id="3" onClick="window.objcConnector.MsgDivClicked_(this.id)">Hello</div>
                        </div>

                        <div class="xxx">Sat,7 Nov.7:38 PM</div>
                    </div>

Objective-c

+ (BOOL)isSelectorExcludedFromWebScript:(SEL)aSelector
{
if (aSelector == @selector(MsgDivClicked:)) return NO;

return YES;}



-(void)MsgDivClicked:(id)object
{
NSLog(@"%@ Div Clicked",object);
}

How to solve:

Scope of this in javascript is pretty tricky, especially when binding DOM events. Instead of explicitly passing the param in your onClick function, we can use the natural click event to get the data you want:

You have:

<div class="msg" id="1" onClick="window.objcConnector.MsgDivClicked_(this.id)">

If we remove the parameter, the function call will have a scope where this is the element clicked. We could also substitute a parameter e which would be the MouseEvent of the click. Then we could get the element via e.target.

<div class="msg" id="1" onClick="window.objcConnector.MsgDivClicked_()">

Since you’re calling an ObjectiveC function and not a JavaScript one, I’m not really sure how the natural scoping works. So instead, lets let a tiny bit of JS do the trick:

<script type="text/javascript">
function objCClickHandler (e) {
  window.objcConnector.MsgDivClicked_(this.id)
}
</script>
<div class="msg" id="1" onClick="objCClickHandler()">

You could also get rid of all the onClick handlers and just do this all in a script tag:

<script type="text/javascript">
Array.from(document.querySelectorAll('.msg')).map(msg => {
  msg.addEventLister('click', e => {
      window.objcConnector.MsgDivClicked_(e.target.id)
  })
}
</script>

Any element that you give a class of ‘msg’ to would then be wired up to click through to your app.

Leave a Reply

Your email address will not be published. Required fields are marked *