Question

我有UIWebView并在其上加载了可编辑的div。只要应用程序启动的div加载到UIWebView并点击（实现了点按手势），它就可以在其上写任何内容。现在我需要在div加载之后（一旦app启动）选择字体，从我已经完成的选择器比我点击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>

div在编辑之前不支持所选字体

0 个答案: