Mathjax插入div寫文本ContentEditable div？

Question

這段代碼在這里

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>mathjx</title>
    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>;
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({tex2jax: { inlineMath: [ ['\\','\\'], ['\\(','\\)'] ] } });
        MathJax.Hub.Config({tex2jax: { displayMath: [ ['$$','$$'], ['\\(','\\)'] ] } });
    </script>
</head>
<body>
<!--Select some random text from this textarea and click button -->
<textarea id="wrapSelectedContent"></textarea>
<!-- Content should be load here using JavaScript and Convert it into Mathematical Function -->
<div id="pasteSelectedContent" contenteditable="true" style="width:300px; height:300px; border:2px solid #000;"></div>
<!-- Static Content displayed Successfully -->
<button onclick="wrapContent();">ConVert</button>
<script type="text/javascript">
    function wrapContent(){
        var selectedContent = document.getElementById("wrapSelectedContent");
        var pasteselectedContent = document.getElementById("pasteSelectedContent");
        var textlength = selectedContent.textLength;
        var start = selectedContent.selectionStart;
        var end = selectedContent.selectionEnd;
        selectedContent.focus();
        selectedContent.setSelectionRange(start,end); 
        var selectedContentValue = selectedContent.value.substring(start, end); 
        var replace = "$$" + selectedContentValue + "$$";
        pasteselectedContent.textContent = selectedContent.value.substring(0,start) + selectedContent.value.substring(end,textlength); 
        MathJax.Hub.Queue(["Typeset", MathJax.Hub, "pasteselectedContent"]);

    }
</script>   
</body>
</html>

代碼運行良好。

現在，我想更改<textarea id="wrapSelectedContent"> => <div contenteditable="true">標記。

我更改了div代碼。 但是腳本錯誤。 “ wh_test.html：27未捕獲的TypeError：selectedContent.setSelectionRange不是函數”

它是如何工作的，請更改此代碼。

Answer 1

首先在contenteditable div中使用相同的ID 。 因此，需要將<textarea id="wrapSelectedContent"></textarea>更改為<div id="wrapSelectedContent" contenteditable="true"></div>標記。

其次， div沒有value屬性，您必須使用innerHTML獲得與textarea類似的結果。 因此下面的var selectedContentValue = selectedContent.value.substring(start, end); 必須更改為var selectedContentValue = selectedContent.innerHTML.substring(start, end);

Mathjax插入div寫文本ContentEditable div？

問題描述

1 個解決方案

解決方案1
0 已采納 2016-08-16 10:21:09

Mathjax插入div寫文本ContentEditable div？

問題描述

1 個解決方案

解決方案1 0 已采納 2016-08-16 10:21:09

解決方案1
0 已采納 2016-08-16 10:21:09