IOS----OC调用JS并获得返回值

最新推荐文章于 2021-06-21 10:28:14 发布

cyj_sky

最新推荐文章于 2021-06-21 10:28:14 发布

阅读量4.2k

点赞数 1

分类专栏： OC javasvript 文章标签： ios开发 javascript

本文链接：https://blog.csdn.net/cyj_sky/article/details/52316625

版权

OC 同时被 2 个专栏收录

1 篇文章 0 订阅

订阅专栏

javasvript

1 篇文章 0 订阅

订阅专栏

本demo是自己所做的 OC调用JS功能的一个简单的例子。

1、准备一个本地化的html网页，我用的是以前做的计算器网页， JavaScript计算机.html

<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
    <head>
        <title>javascript计算机demo</title>
        <meta charset="utf-8">
        <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <link rel="stylesheet" href="css/fonts/font-awesome.min.css">
        <link rel="stylesheet" href="css/ui-box.css">
        <link rel="stylesheet" href="css/ui-base.css">
        <link rel="stylesheet" href="css/ui-color.css">
        <link rel="stylesheet" href="css/appcan.icon.css">
        <link rel="stylesheet" href="css/appcan.control.css">
        
  
    <script language="JavaScript">
   
    </script>
       
    </head>
    <body>
    
  
    </body>
    <form action="" method="post" name="myform" id="myform">
    <p>第一个数
    <input name="num1" type="text" id="num1" size="25">
    <br />
    第二个数
    <input name="num2" type="text"  id="num2" size="25">
    </p>
    <p>
    <input name="addButton" type="button" id="addButton" value="+"  οnclick="comput('+')">
    <input name="subButton" type="button" id="subButton" value="-"  οnclick="comput('-')">
    <input name="multButton" type="button" id="multButton" value="X"  οnclick="comput('*')">
    <input name="divButton" type="button" id="divButton" value="➗"  οnclick="comput('/')">
    </p>
    <p>
    计算结果
    <input name="result" type="text" id="result" size="25" >
    </p>
    </form>
    <script>
    function comput(op){
   var num1 =0;
   var num2 =0;
   num1 = parseFloat(document.myform.num1.value)
   num2 = parseFloat(document.myform.num2.value)
   comput2(num1,num2,op);
   }
   function comput2(num1,num2,op){
   if(op == "+")
   document.myform.result.value = num1+num2;
   if(op == "-")
   document.myform.result.value = num1-num2;
   if(op == "*")
   document.myform.result.value = num1*num2;
   if(op == "/" && num2!=0)
   document.myform.result.value = num1/num2;
   return document.getElementById("result").value;
   }
    </script>
</html>

2、将此html文件放到项目代码目录里面，如图：

3、拖一个UIWebView控件和UIButton控件和一个UILable控件到xxxViewController对应的.xib或.storyboard视图的UIView上；

分别添加属性以及button的点击事件，并且添加一个UIWebViewDelegate类型的代理。（如图所示）

代理直接在xib中拖线即可；

4、在xxxViewController.m文件中实现通过点击事件，调用javaScript的方法并取得返回值。

代码如下：

- (void)viewDidLoad {
    [super viewDidLoad];
    _MyWeb.backgroundColor = [UIColor clearColor];
    //webview.scalesPageToFit =YES;
    //找到<span style="font-size:18px;">JavaScript计算机.html</span>文件的路径
    NSString *basePath = [[NSBundle mainBundle]bundlePath];
    NSString *helpHtmlPath = [basePath stringByAppendingPathComponent:@"JavaScript计算机.html"];
    NSURL *url = [NSURL fileURLWithPath:helpHtmlPath];
    //加载本地html文件
    [_MyWeb loadRequest:[NSURLRequest requestWithURL:url]];
    
}

- (IBAction)js_ios:(UIButton *)sender {
    NSString *str1 = [self.MyWeb stringByEvaluatingJavaScriptFromString:@"comput2();"];
//    NSLog(@"JS返回值：%@",str1);
    NSString *str2 =[NSString stringWithFormat:@"JS返回值：%@",str1];
// 在lable上展示
    self.MyLable.text = str2;
}



- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

最终效果如图所示：

cyj_sky

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
IOS----OC调用JS并获得返回值

本demo是自己所做的 OC调用JS功能的一个简单的例子。1、准备一个本地化的html网页，我用的是以前做的计算器网页， JavaScript计算机.html javascript计算机demo
复制链接

扫一扫

专栏目录