顯示具有 [javascript] 標籤的文章。 顯示所有文章
顯示具有 [javascript] 標籤的文章。 顯示所有文章

2014年7月28日 星期一

UIWebview 的javascript與ios objective-c互動傳參數(Ⅱ)

繼4個月前的一篇【UIWebview 的javascript與ios objective-c互動傳參數

有人問到要如何從objective-c呼叫網頁的function並回傳值

以下為沒有傳參數的方法,

傳參數給網頁的function請看

UIWebview 的javascript與ios objective-c互動傳參數】 此篇


若要從objective-c去呼叫網頁javascript並回傳值的話

有兩種作法

一種就是再用function去呼叫丟objective-c內的的function

此方法較複雜也較麻煩  此方法可用前篇 在網頁呼叫callObjFunction的function

這是其中一種作法。

另種作法就最單純簡單 

就直接在javascript使用return 就可以傳回到objective-c內

例:

webview的程式碼:


<!DOCTYPE html>
<html>
    <head>
        <script>
            
        function callObjFunction()
        {
        
         return "I will return from js web";   
        }
       </script>
    </head>

    <body>
        
    </body>
</html>

Objective-c程式關鍵部份:



 NSString *str = [_theWebview stringByEvaluatingJavaScriptFromString: [NSString stringWithFormat:@"callObjFunction()"]];
    NSLog(@"str:%@", str);


這樣就可以看見log有I will return from js web的字樣

發文附圖:


範例程式: GitHub



2014年3月17日 星期一

UIWebview 的javascript與ios objective-c互動傳參數

UIWebview與Javascript互傳資料 可以參考此篇

我覺得寫的還不錯

 我們先來說說 Javascript 去 呼叫Objective-c 的function

 在javascript網頁建立一個HTML檔,


<!DOCTYPE html>
<html>
    <head>
        <script>
            
        function callObjFunction()
        {
        var jsParam = "paramFromJs";
        window.location  = 'js-call:runObjMethod:';
            
        }
       </script>
    </head>

    <body>
        <button onclick="callObjFunction()">call obj function</button>
    </body>
</html>
然後在我們的xcode裡objective-c 建立被呼叫的function
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    NSString *urlString = request.URL.absoluteString;
    // 判斷點下的網址是否有js-call,更精確應該再比對切出來的字串是否有runObjMethod
    if( [urlString hasPrefix:@"js-call:"])
    {
        [self runObjMethod];
        
        return NO;
    }
    return YES;
    
}

-(void) runObjMethod
{
    NSLog(@"this is objective-c method");
}
p.s. 如果你要javascript帶傳參數到objective-c的話,就js-call:param1:param2 然後去parse出param1,param2的內容就可以~ 若要回傳參數的話(objective -> javascript) 我們先把原本的HTML的javascript 內新增
function jsFunction(str)
{
    alert("this is javascript alert! -> obj2 pass value to js show:"+str);
}

在objective-c內的runObjMethod function下加入
// 方法1
NSString *myval = @"my parameters from objective-c";
// javascript 的function 名稱 與obj變數組合成字串
    NSString  *jsMethod = [NSString stringWithFormat:@"%@%@%@", @"jsFunction('", myval, @"')"];

   [_myWebView stringByEvaluatingJavaScriptFromString:jsMethod];
// 或    
// 方法2
    [_myWebView stringByEvaluatingJavaScriptFromString: [NSString stringWithFormat:@"jsFunction('%@')",myval ]];
這樣就可以將objective-c的參數 傳到UIWebview裡面的網頁囉~

2012年11月24日 星期六

滑鼠移上切換圖片

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
       

            icon = new Image();
            icon.src = "../image/1.png";
            icon2 = new Image();
            icon2.src = "../image/2.jpg";
            icon3 = new Image();
            icon3.src = "../image/3.jpg";
            icon4 = new Image();
            icon4.src = "../image/4.png";
            function showImages(obj) {
                // DOM
               // var theImg = document.getElementById("myID");
                // theImg.src = obj;
                // BOM
                document.images[0].src = obj;
        }
    </script>
</head>
<body>
<a href="#" onmouseover="showImages(icon.src)">icon1</a> | <a href="#" onmouseover="showImages(icon2.src)">icon2</a> | <a href="#" onmouseover="showImages(icon3.src)">icon3</a> | <a href="#" onmouseover="showImages(icon4.src)">icon4</a>
<hr />
<img id="myID" src="../image/1.png" width="200px" />
</body>
</html>

2012年11月23日 星期五

置換網頁,不出現上一頁

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
    </script>
</head>
<body>
    <input type="button" value="href"  onclick="location.href='http://www.yahoo.com.tw'"/>
    <input type="button" value="replace"  onclick="location.replace('http://www.yahoo.com.tw')"/>
</body>
</html>



通常用reload會出現上一頁的按鈕讓使用者回去前一頁,

但今天如果不想讓使用者回前一頁的話,

可以使用replace()的方式就不會有這個問題出現

[javascript]抓取螢幕屬性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--螢幕物件-->
<head>
    <title></title>
    <script type="text/javascript">
        window.onload = function () {
            with (document) {
                write("<pre>");
                writeln("螢幕可用高度:" + screen.availHeight);
                writeln("螢幕可用寬度:" + screen.availWidth);
                writeln("高度:" + screen.height);
                writeln("寬 度:" + screen.width);
                writeln("色彩:" + screen.colorDepth);
                write("</pre>");
            }
        }
    </script>
</head>
<body></body>