如何使用stringbyEvaluationJSS将Javascript插入$（document）.ready（function（）

Question

hi
i have a Problem,i want to Injet a var from nativ to my WebSolution.
Cause i want to know, when a iDevice visit the page, some buttons have to be visible...
So i tried somethink like that:. On the index.html i have JQuery Script:

$(document).ready(function(){ var htmlvar = varFromUiWebView; alert(htmlvar); }

At my xCode project: On the UIWebview Delegate: UiWebviewDidFinishload:, i have something like that:

[browser stringByEvaluatingJavaScriptFromString:@"varFromUiWebView = 1;"];

So, the result is that the script crash, because 'varFromUiWebView' is undefined. How can i fix it?

Thank you in advance Konstantin

Answer 1

at what point do you do the stringByEvaluatingJavaScriptFromString?

My guess is that you have to wait for the page to be fully loaded before you try to run extra javascript ie you will need to have it in

- (void)webViewDidFinishLoad:(UIWebView *)theWebView

I realise this would mean that your js alert would probably appear before you get a chance to set the value you want to see but that's not the issue.

hope this helps.

Answer 2

why not have all your iPhone buttons have a specific class (ie: iphone) the has a display:none css property and then in your app you can use:

- (void)webViewDidFinishLoad:(UIWebView *)theWebView {
    NSString *insertRule = [NSString stringWithFormat:@"addCSSRule('iphone', 'display: block;')"];
    [theWebView stringByEvaluatingJavaScriptFromString:insertRule];
}

Answer 3

So at this time i think it isnt possible to inject a variable from :

[theWebView stringByEvaluatingJavaScriptFromString:@"var valueFromNativ = 1"];

to the DOM of the browser Website :
example :

$(document).ready(function(){
  var clientValue = valueFromNativ;
});

so a very easy workaround is to catch via userAgend the Device which visit your Page:

  $(document).ready(function() {
            var isMobile = navigator.userAgent.match(/(iPhone|iPod|iPad|Android)/);
            if (isMobile == null) {
                $('#justTablets').hide();
            }
        });<br>

If now somebody visit with ipad my website a <div id="justTablets">Content ...</div> will shown, but if you are a simple desktop, laptop, it will be hidden ... see here http://jsfiddle.net/konstheinrich188/jASy8/