如何使用JQuery在框中定位MathJax元素

How do you position a MathJax element within a box using JQuery?

本文关键字:定位 MathJax 元素 何使用 JQuery      更新时间:2023-09-26

我正试图在一个框中定位一个MathJax元素。我试过几种不同的方法,但都不管用。盒子本身被定位,但我希望附加到盒子的元素被定位在同一个盒子内(#third)。到目前为止,代码实际上移动了整个第三个框,而不是附加到第三个方框的元素。这是Javascript/JQuery代码。完整的代码可以在以下链接中查看:MathJax code

函数下降

ev.preventDefault();
var data = ev.dataTransfer.getData("text");
//ev.target.appendChild(document.getElementById(data));
switch(data)
{
       case("drag1"):
         $('#second').append('$$''sum$$');
         break;
   case("drag2"):
     $('#second').append('$$''int$$');
         break;
       case("drag3"):
     $('#second').append('$$''alpha$$');
         break;
       case("drag4"):
     //$('#second').css("font-size","150%");
         $('#second').append('$$''beta$$').css("font-size","150%");
         break;
        case("drag5"):
         $('#second').append('$${du}$$');
         break;
        case("drag6"):
         $('#second').append('$${dt}$$');
         break;
        case("drag7"):
         $('#second').append('$${t}$$');
         break;

       case("drag8"):

          //$('#second').append('$$''beta$$').css("font-size","150%");
          //var $sqrtEqElement = $('#third').append('$${t}^x''sqrt{t}^x$$').css("font-size","100%"); 
          //var $sqrtEqElement = document.createElement("$${t}^x''sqrt{t}^x$$");
          //$('#sqrtEqElement').parent().css({position: 'absolute'});
          //$('#sqrtEqElement').css( { position: 'absolute', top: 0, left: 0} );
          $('#second').append('$${t}^x''sqrt{t}^x$$');
          $('#container').append('<div id="third" ondrop="drop(event)" ondragover="allowDrop(event)"></div>');
          $('#third').append('$${t}^x''sqrt{t}^x$$').css( { position: 'absolute', top: 10, left: 100} ); //not working
          //$('#third').append('<label>Filename:</label> <input type="text" name="file"  id="file" />');
          break;
       default:
    }
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,"second"]);
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,"third"]);

}

您尝试过以下操作吗:

  var text = '<span style="position:absolute; top: 10px; left: 100px;">$${t}^x''sqrt{t}^x$$</span>';
  $('#third').append(text);