2011-10-28 4 views
8

입력하는 동안이 mathjax 예제를 실시간 미리보기로 수정하려면 어떻게해야합니까? 지금은 엔터를 누른 후에 만 ​​결과를 표시합니다. stackoverflow/math.stackexchange가 질문을 입력 할 때 미리보기를 표시하는 것과 비슷한 방식으로 작동하도록 수정하고 싶습니다. 대신 onchange를 사용실시간으로 mathjax 출력 표시

<html> 
<head> 
<title>MathJax Dynamic Math Test Page</title> 

<script type="text/x-mathjax-config"> 
    MathJax.Hub.Config({ 
    tex2jax: { 
     inlineMath: [["$","$"],["\\(","\\)"]] 
    } 
    }); 
</script> 
<script type="text/javascript" 
    src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full"> 
</script> 

</head> 
<body> 

<script> 
    // 
    // Use a closure to hide the local variables from the 
    // global namespace 
    // 
    (function() { 
    var QUEUE = MathJax.Hub.queue; // shorthand for the queue 
    var math = null;    // the element jax for the math output. 

    // 
    // Get the element jax when MathJax has produced it. 
    // 
    QUEUE.Push(function() { 
     math = MathJax.Hub.getAllJax("MathOutput")[0]; 
    }); 

    // 
    // The onchange event handler that typesets the 
    // math entered by the user 
    // 
    window.UpdateMath = function (TeX) { 
     QUEUE.Push(["Text",math,"\\displaystyle{"+TeX+"}"]); 
    } 
    })(); 
</script> 

Type some TeX code: 
<input id="MathInput" size="50" onchange="UpdateMath(this.value)" /> 
<p> 

<div id="MathOutput"> 
You typed: ${}$ 
</div> 

</body> 
</html> 
+0

네, 왜냐하면 'onchange'는 엔터 키를 누르거나 필드가 흐려질 때만 발생하기 때문입니다. – think123

+0

미래의 메모 : cdn.mathjax.org의 수명이 다해 가고 있습니다. https://www.mathjax.org/cdn-shutting-down/에서 마이그레이션 팁을 확인하십시오. –

+0

@PeterKrautzberger 수학 공식을 사용하여 질문/의견을 입력 할 수있는 입력란이있는 WordPress 사이트에서 MathJax의 실시간 미리보기를 보여주는 가장 좋은 방법은 무엇입니까? 절대 초보자의 경우 "what"과 "where"를 입력하여 스크립트가 있으면 입력하십시오. 감사합니다. – user12345

답변

4

onkeypress 또는 onkeyup보십시오.

onchange은 사용자가 필드를 떠날 때만 트리거되지만 다른 키 스트로크 (키 스트로크)마다 발생합니다.

+0

수학 공식으로 질문/의견을 쓰는 입력란이있는 WordPress 사이트에서 MathJax의 실시간 미리보기를 보여주는 가장 좋은 방법은 무엇입니까? 절대 초보자의 경우 "what"과 "where"를 입력하여 스크립트가 있으면 입력하십시오. 감사합니다 – user12345

1

다른 브라우저와 마찬가지로 자주 또는 효율적으로 onchange 이벤트를 발생시키지 않는 Internet Explorer를 사용하고있는 것으로 의심됩니다.

MathJax Examples의 버전에는 IE를 더 잘 처리 할 수있는 코드가 더 많이 포함되어 있습니다. 자세한 내용은 소스 코드를 참조하십시오.

+0

이것은 실제로 실제로 사실이 아닙니다. – think123