• Kmath里MathJax和markdown整合


    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="New.aspx.cs" Inherits="math.article.New" %>

    <!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="../javascript/jquery3.1.min.js"></script>

    <script src="../javascript/mathjax_config.js"></script>
    <script src="../javascript/marked/marked3.0.0.js"></script>

    <script src="../javascript/mathJax/es5/tex-chtml-full.js"></script>

    <link href="new2.css" rel="stylesheet" />

    <title></title>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    <style>
    .subnav-content9 div{ background-color:#000000; color:#ffffff; }
    </style>



    <div class="math-menu" data-editorid="editor">

    <div class="sub-math-menu">
    <span class="subnavbtn9">希腊字母 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <div>小写字母</div>
    <a class="add" data-math="\alpha">@\alpha@</a><a class="add" data-math="\beta">@\beta@</a><a class="add" data-math="\gamma">@\gamma@</a><a class="add" data-math="\delta">@\delta@</a><a class="add" data-math="\epsilon">@\epsilon@</a><a class="add" data-math="\varepsilon">@\varepsilon@</a><a class="add" data-math="\zeta">@\zeta@</a><a class="add" data-math="\eta">@\eta@</a><a class="add" data-math="\theta">@\theta@</a><a class="add" data-math="\vartheta">@\vartheta@</a><a class="add" data-math="\iota">@\iota@</a><a class="add" data-math="\kappa">@\kappa@</a><a class="add" data-math="\lambda">@\lambda@</a><a class="add" data-math="\mu">@\mu@</a><a class="add" data-math="\nu">@\nu@</a><a class="add" data-math="o">@o@</a><a class="add" data-math="\pi">@\pi@</a><a class="add" data-math="\rho">@\rho@</a><a class="add" data-math="\varrho">@\varrho@</a><a class="add" data-math="\sigma">@\sigma@</a><a class="add" data-math="\varsigma">@\varsigma@</a><a class="add" data-math="\tau">@\tau@</a><a class="add" data-math="\upsilon">@\upsilon@</a><a class="add" data-math="\phi">@\phi@</a><a class="add" data-math="\varphi">@\varphi@</a><a class="add" data-math="\chi">@\chi@</a><a class="add" data-math="\psi">@\psi@</a><a class="add" data-math="\omega">@\omega@</a><a class="add" data-math=" \xi">@ \xi@</a><a class="add" data-math="\varpi">@\varpi@</a>

    <div style="clear:both"></div>

    <div>大写字母</div>
    <a class="add" data-math="\Gamma">@\Gamma@</a><a class="add" data-math="\Delta">@\Delta@</a><a class="add" data-math="\Theta">@\Theta@</a><a class="add" data-math="\Lambda">@\Lambda@</a><a class="add" data-math="O">@O@</a><a class="add" data-math="\Pi">@\Pi@</a><a class="add" data-math="\Sigma">@\Sigma@</a><a class="add" data-math="\Upsilon">@\Upsilon@</a><a class="add" data-math="\Phi">@\Phi@</a><a class="add" data-math="\Psi">@\Psi@</a><a class="add" data-math="\Omega">@\Omega@</a>

    </div>
    </div>


    <div class="sub-math-menu">
    <span class="subnavbtn9">运算符 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <a class="add" data-math="\times">@\times@</a><a class="add" data-math="\div">@\div@</a><a class="add" data-math="\cdot">@\cdot@</a><a class="add" data-math="\pm">@\pm@</a><a class="add" data-math="\mp">@\mp@</a><a class="add" data-math="\ast">@\ast@</a><a class="add" data-math="\star">@\star@</a><a class="add" data-math="\circ">@\circ@</a><a class="add" data-math="\bullet">@\bullet@</a><a class="add" data-math="\oplus">@\oplus@</a><a class="add" data-math="\ominus">@\ominus@</a><a class="add" data-math="\oslash">@\oslash@</a><a class="add" data-math="\otimes">@\otimes@</a><a class="add" data-math="\odot">@\odot@</a><a class="add" data-math="\dagger">@\dagger@</a><a class="add" data-math="\ddagger">@\ddagger@</a><a class="add" data-math="\vee">@\vee@</a><a class="add" data-math="\wedge">@\wedge@</a><a class="add" data-math="\cap">@\cap@</a><a class="add" data-math="\cup">@\cup@</a><a class="add" data-math="\aleph">@\aleph@</a><a class="add" data-math="\Re">@\Re@</a><a class="add" data-math="\Im">@\Im@</a><a class="add" data-math="\top">@\top@</a><a class="add" data-math="\bot">@\bot@</a><a class="add" data-math="\infty">@\infty@</a><a class="add" data-math="\partial">@\partial@</a><a class="add" data-math="\forall">@\forall@</a><a class="add" data-math="\exists">@\exists@</a><a class="add" data-math="\neg">@\neg@</a><a class="add" data-math="\angle">@\angle@</a><a class="add" data-math="\triangle">@\triangle@</a><a class="add" data-math="\diamond">@\diamond@</a>
    </div>
    </div>


    <div class="sub-math-menu">
    <span class="subnavbtn9">不等式 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <a class="add" data-math="\geq">@\geq@</a><a class="add" data-math="\prec">@\prec@</a><a class="add" data-math="\succ">@\succ@</a><a class="add" data-math="\preceq">@\preceq@</a><a class="add" data-math="\succeq">@\succeq@</a><a class="add" data-math="\gg">@\gg@</a><a class="add" data-math="\equiv">@\equiv@</a><a class="add" data-math="\sim">@\sim@</a><a class="add" data-math="\simeq">@\simeq@</a><a class="add" data-math="\asymp">@\asymp@</a><a class="add" data-math="\approx">@\approx@</a><a class="add" data-math="\ne">@\ne@</a><a class="add" data-math="\subset">@\subset@</a><a class="add" data-math="\supset">@\supset@</a><a class="add" data-math="\subseteq">@\subseteq@</a><a class="add" data-math="\supseteq">@\supseteq@</a><a class="add" data-math="\in">@\in@</a><a class="add" data-math="\ni">@\ni@</a><a class="add" data-math="\notin">@\notin@</a>
    </div>
    </div>

    <div class="sub-math-menu">
    <span class="subnavbtn9">微积分 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <a class="add" data-math="x_{a}">@x_{a}@</a><a class="add" data-math="x^{b}">@x^{b}@</a><a class="add" data-math="x_{a}^{b}">@x_{a}^{b}@</a><a class="add" data-math="\bar{x}">@\bar{x}@</a><a class="add" data-math="\tilde{x}">@\tilde{x}@</a><a class="add" data-math="\frac{a}{b}">@\frac{a}{b}@</a><a class="add" data-math="\sqrt{x}">@\sqrt{x}@</a><a class="add" data-math="\sqrt[n]{x}">@\sqrt[n]{x}@</a><a class="add" data-math="\bigcap_{a}^{b}">@\bigcap_{a}^{b}@</a><a class="add" data-math="\bigcup_{a}^{b}">@\bigcup_{a}^{b}@</a><a class="add" data-math="\prod_{a}^{b}">@\prod_{a}^{b}@</a><a class="add" data-math="\coprod_{a}^{b}">@\coprod_{a}^{b}@</a><a class="add" data-math="\left( x \right)">@\left( x \right)@</a><a class="add" data-math="\left[ x \right]">@\left[ x \right]@</a><a class="add" data-math="\left \{ x \right \}">@\left \{ x \right \}@</a><a class="add" data-math="\left| x \right|">@\left| x \right|@</a><a class="add" data-math="\int_{a}^{b}">@\int_{a}^{b}@</a><a class="add" data-math="\oint_{a}^{b}">@\oint_{a}^{b}@</a><a class="add" data-math="\sum_{a}^{b}{x}">@\sum_{a}^{b}{x}@</a><a class="add" data-math="\lim_{a \rightarrow b}{x}">@\lim_{a \rightarrow b}{x}@</a><a class="add" data-math=" \begin{pmatrix}a&b\\c&d\\ \end{pmatrix}">@ \begin{pmatrix}a&b\\c&d\\ \end{pmatrix}@</a><a class="add" data-math=" \begin{bmatrix}a&b\\c&d\\ \end{bmatrix}">@ \begin{bmatrix}a&b\\c&d\\ \end{bmatrix}@</a><a class="add" data-math="\begin{Bmatrix}a&b\\c&d\\ \end{Bmatrix}">@\begin{Bmatrix}a&b\\c&d\\ \end{Bmatrix}@</a><a class="add" data-math="\begin{vmatrix}a&b\\c&d\\ \end{vmatrix}">@\begin{vmatrix}a&b\\c&d\\ \end{vmatrix}@</a>
    </div>
    </div>


    <div class="sub-math-menu">
    <span class="subnavbtn9">箭头 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <a class="add" data-math="\leftarrow">@\leftarrow@</a><a class="add" data-math="\rightarrow">@\rightarrow@</a><a class="add" data-math="\leftrightarrow">@\leftrightarrow@</a><a class="add" data-math="\Leftarrow">@\Leftarrow@</a><a class="add" data-math="\Rightarrow">@\Rightarrow@</a><a class="add" data-math="\Leftrightarrow">@\Leftrightarrow@</a><a class="add" data-math="\uparrow">@\uparrow@</a><a class="add" data-math="\downarrow">@\downarrow@</a><a class="add" data-math="\updownarrow">@\updownarrow@</a><a class="add" data-math="\Uparrow">@\Uparrow@</a><a class="add" data-math="\Downarrow">@\Downarrow@</a><a class="add" data-math="\Updownarrow">@\Updownarrow@</a>
    </div>
    </div>



    <div class="sub-math-menu">
    <span class="subnavbtn9">常用公式 <span class="drop"></span> </span>
    <div class="subnav-content9">
    <div>二次根式</div>
    <a class="add" data-math="x = {-b \pm \sqrt{b^2-4ac} \over 2a}">@x = {-b \pm \sqrt{b^2-4ac} \over 2a}@</a>
    <div style="clear:both"></div>
    <div>等比求和</div>
    <a class="add" data-math="S_{n}=\begin{cases}a,\left( 1-q^{n}\right) ,q\neq 1\\ na_{1},q=1\end{cases}">@S_{n}=\begin{cases}a,\left( 1-q^{n}\right) ,q\neq 1\\ na_{1},q=1\end{cases}@</a>

    <div style="clear:both"></div>
    <div>偏分方程</div>
    <a class="add" data-math="\frac{\partial f}{\partial y}(x,y) = x + 2y">@\frac{\partial f}{\partial y}(x,y) = x + 2y@</a>


    <div style="clear:both"></div>
    <div>正态分布</div>
    <a class="add" data-math="\frac1{\sigma\sqrt{2\pi}} \exp \left(-\frac{\left(x-\mu\right)^2}{2\sigma^2} \right)">@\frac1{\sigma\sqrt{2\pi}} \exp \left(-\frac{\left(x-\mu\right)^2}{2\sigma^2} \right)@</a>

    </div>
    </div>


    <a href="###" onclick="openSx()" >手写公式</a>

    </div>

    <div style="display:flex">
    <div style="50%">

    <textarea name="txt_question" style="500px; height:600px; " id="txt_question">

    设 $x_{1} \alpha_{1}+x_{2} \alpha_{2}+x_{3} \alpha_{3}+x_{4} \alpha_{4}=\beta$, 按分量写出, 则有
    $$
    \left\{\begin{array}{l}
    x_{1}+x_{2}+x_{3}+x_{4}=1 \\
    x_{2}-x_{3} \alpha_{3}+2 x_{4}=1 \\
    2 x_{1}+3 x_{2}+(a+2) x_{3}+4 x_{4}=b+3 \\
    3 x_{1}+5 x_{2}+x_{3}+(a+8) x_{4}=5
    \end{array}\right.
    $$
    对方程组的增广矩阵作初等行变换:
    第一行分别乘以有 $(-2) 、(-3)$ 加到第三行和第四行上, 再第二行乘以 $(-1) 、(-2)$ 加到第三 行和第四行上, 有


    </textarea>
    </div>


    <div style="50%; background-color:#f2f2f2">

    <iframe id=preview frameborder="0"
    width="100%" src="Preview.aspx" style="height:400px;"
    scrolling="no" >
    </iframe>
    </div>

    </div>


    </div>



    <script>


    $("#txt_question").on("keyup", function () {
    setTimeout(updatePreview, 500);
    });

    function updatePreview() {

    var data = $("#txt_question").val();

    //H3
    data = data.replace(/^(#{1,6})(.*)(?:\n+|$)/ig, function ($1, $2, $3) {
    return '<h' + $2.length + '>' + $3 + '</h' + $2.length + '>';
    });

    //Bold
    data = data.replace(/(\*\*)([^]*?)(\*\*)/ig, function ($1, $2, $3) {
    return "<strong>" + $3 + "</strong>"
    });

    // data = t.replace(/</g, "&lt;");
    // data = data.replace(/>/g, "&gt;");
    data = data.replace(/\n/g, "<br>");


    var result = data.replace(/\$\$[^]*?\$\$/ig, function ($1, $2) {
    // var t = $1.replace(/<br>/ig, "");
    var t = $1;
    t = t.replace(/</g, "&lt;");
    t = t.replace(/>/g, "&gt;");
    t = t.replace(/\n/g, "<br>");
    return t;
    });




    preview.contentWindow.document.getElementById('math').innerHTML = data;

    preview.contentWindow.doing();


    }

    setTimeout(updatePreview, 500);

    </script>




    </form>
    </body>
    </html>

  • 相关阅读:
    conrtex 和 ARM 的关系
    C语言中的内存分配深入
    钳位电路
    向量中断与非向量中断的区别
    Freescale PowerPC处理器优势
    路由器端口映射,远程桌面连接端口映射+花生壳=让人访问你个人服务器或WEB站点
    linux 下用G++编译C++
    Javascript基础知识篇(1): 初识Javascript
    Javascript实战应用篇(3):动态加载JS和CSS文件
    Javascript高级技术篇(1):搭建JS框架类库
  • 原文地址:https://www.cnblogs.com/mqingqing123/p/16168390.html
Copyright © 2020-2023  润新知