为什么iframe内的链接无法在phonegap ios应用程序中运行?

时间:2015-03-26 11:11:02

标签: ios cordova iframe safari

我正在开发一个Phonegap IOS应用程序。我的一个页面包含一个iframe。我有一个文本框,用户可以在其中键入URL。文本框中的URL将设置iframe源。用户应该能够在iframe中导航。之后,我必须将URL保存在数据库中。我已应用smartzoom jquery插件来缩放iframe,它工作正常。在safari链接正在工作,但在模拟器链接不可点击。如何在iframe中点击链接?这里是jsfiddle链接我到目前为止所做的工作,它在brwoser中运行良好,但在模拟器中没有。

<div id="positionButtonDiv">
    <p> <span>
                    <img id="btnzoomIn" class="zoomButton" src="http://e-smartdev.com/github/smartJQueryZoom/example/assets/zoomIn.png" height="34" width="34" title="zoom in" alt="zoom in" /> 
                    <img id="btnzoomOut" class="zoomButton" src="http://e-smartdev.com/github/smartJQueryZoom/example/assets/zoomOut.png" height="34" width="34" title="zoom out" alt="zoom out" /> 
                    </span>

    </p>
    <p> <span class="positionButtonSpan">
                    <map name="positionMap" class="positionMapClass">
                    <area id="btnUp" shape="rect" coords="20,0,40,20" title="move up" alt="move up" />
                    <area id="btnLeft" shape="rect" coords="0,20,20,40" title="move left" alt="move left" />
                    <area id="btnRight" shape="rect" coords="40,20,60,40" title="move right" alt="move right" />
                    <area id="btnDown" shape="rect" coords="20,40,40,60" title="move bottom" alt="move bottom" />
                    </map>
                    <img src="http://e-smartdev.com/github/smartJQueryZoom/example/assets/position.png" height="58" width="58" usemap="#positionMap"> 
                    </span>

    </p>
</div>
<div id="viewsites" class="viewsites">
    <iframe scrolling="no" id="viewsite_iframe" sandbox="allow-scripts allow-popups allow-forms" src="" class="clsIframe"></iframe>
</div>

jscode

$(document).ready(function () {

    $('#btnUp,#btnLeft,#btnRight,#btnDown').bind("click", moveButtonClickHandler);
    $('#btnzoomIn,#btnzoomOut').bind("click", zoomButtonClickHandler);

    function zoomButtonClickHandler(e) {
        var scaleToAdd = 0.8;
        if (e.target.id == 'btnzoomOut') scaleToAdd = -scaleToAdd;
        $('#viewsite_iframe').smartZoom('zoom', scaleToAdd);
    }

    function moveButtonClickHandler(e) {
        var pixelsToMoveOnX = 0;
        var pixelsToMoveOnY = 0;

        switch (e.target.id) {
            case "btnLeft":
                pixelsToMoveOnX = 50;
                break;
            case "btnRight":
                pixelsToMoveOnX = -50;
                break;
            case "btnUp":
                pixelsToMoveOnY = 50;
                break;
            case "btnDown":
                pixelsToMoveOnY = -50;
                break;
        }
        $('#viewsite_iframe').smartZoom('pan', pixelsToMoveOnX, pixelsToMoveOnY);
    }


    try {

        $('#viewsite_iframe').attr('src', "http://www.w3schools.com/");
        if ($('#viewsite_iframe').smartZoom('isPluginActive')) {
            $('#viewsite_iframe').smartZoom('destroy');
        }
        $('#viewsite_iframe').smartZoom({
            'containerClass': 'zoomContainer',
                'easing': 'smartZoomEasing',
                'dblClickEnabled': true, // enable plugin mouse doubleClick behviour
            'mouseMoveEnabled': false, // enable plugin target drag behviour
            'moveCursorEnabled': true, // show moveCursor for drag
            'touchEnabled': true, // enable plugin touch interaction 
            'dblTapEnabled': true, // enable plugin double tap behaviour 
            'pinchEnabled': true, // enable zoom when user pinch on target
            'touchMoveEnabled': true, // enable target move via touch
            'maxScale': 1.8,
                'zoom': 0.1
        });
    } catch (e) {
        alert(e)
    }
});

1 个答案:

答案 0 :(得分:0)

您使用的是phonegap开发者应用来测试您的应用吗?如果是,对于外部链接,使用if IFrame对于phonegap开发者应用上的IOS无法正常工作。您需要构建ipa文件。