0

我有一个UIWebView并加载了可编辑div的。一旦应用程序启动的 div 被加载UIWebView并点击(实现了点击手势),它就允许在其上写任何东西。现在我需要在 div 加载后(一旦应用程序启动),从我已经完成的选择器中选择字体,而不是点击UIWebView以使用所选字体写入,但我无法实现这一点。但是一旦div/UIWebView处于活动状态,即准备好输入而不是下面的代码工作

[webViewForEditing stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.execCommand('fontName', true, '%@')",fontName]];  

这是我的脚本

 <html>

  <script type="text/javascript">

    document.addEventListener('touchend', function(e){

       // Listen for touch end on the document

        // Get the touch and coordinates
        var touch = e.changedTouches.item(0);
        var touchX = touch.clientX;
        var touchY = touch.clientY;

        // Get the rect for the content  
        var contentDIVRect = document.getElementById('content').getClientRects()[0];

        // Make sure we don't block touches to the content div
        if (touchX > contentDIVRect.left && touchY < contentDIVRect.bottom) {
        return;
        }

        // If the touch is out of the content div then simply give the div focus
        document.getElementById('content').focus();
        document.execCommand('fontName', true, fontName);


    }, false);  

    function moveImageAtTo(x, y, newX, newY) {
        // Get our required variables



        var element  = document.elementFromPoint(x, y);
        if (element.toString().indexOf('Image') == -1)
        {
            // Attempt to move an image which doesn't exist at the point
            return;
        }
        var caretRange = document.caretRangeFromPoint(newX, newY);
        var selection = window.getSelection();

        // Save the image source so we know this later when we need to re-insert it
        var imageSrc = element.src;

        // Set the selection to the range of the image, so we can delete it
        var nodeRange = document.createRange();
        nodeRange.selectNode(element);
        selection.removeAllRanges();
        selection.addRange(nodeRange);

        // Delete the image
        document.execCommand('delete');


        document.execCommand('insertText', false, ' ');
        // Set the selection to the caret range, so we can then add the image
        var selection = window.getSelection();
        var range = document.createRange();


        selection.removeAllRanges();
        selection.addRange(caretRange);

        // Re-insert the image
        document.execCommand('insertImage', false, imageSrc);
    }

</script>
<style>

    #content img{
        height:25px;
        width:25px;

    }
</style>

<body>
 <div id="content" contenteditable="true" style="font-family: Frank the Architect ; font-size:18px">TAP HERE TO BEGIN WRITING...</div>
</body>

4

0 回答 0