十进制到分数计算器 Javascript 问题

Question

我正在尝试制作像(https://www.decimal-to-fraction.com/(这样的十进制到分数计算器。但我面临着一些问题。我认为这是一个jquery问题。

控制台错误显示 ($ 不是一个函数(

我试过这个：

$(document).ready(function() {
  var params = GetURLParams();
  if (Object.keys(params).length > 0 && params.x != "") {
    document.getElementById("x").value = params.x;
  }
});
function GetURLParams() {
  var url = window.location.href;
  var regex = /[?&]([^=#]+)=([^&#]*)/g,
    params = {},
    match;
  while (match = regex.exec(url)) {
    params[match[1]] = match[2];
  }
  return params;
}
var gcd2 = function(a, b, f) {
  if (f) {
    if (b <= 1)
      return a;
  } else {
    if (!b)
      return a;
  }
  return gcd2(b, a % b, f);
};

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="x" name="x" class="intext form-control" tabindex="1">
<button type="button" title="Convert" class="btn btn-lg btn-primary" tabindex="2" onclick="convert()"> Convert</button>
<input class="form-control" type="text" id="y" tabindex="5" readonly>
<input class="form-control" type="text" id="n" tabindex="6" readonly>
<canvas id="frac"></canvas>
<input class="form-control" type="text" id="d" tabindex="7" readonly>
<textarea rows="7" id="area" tabindex="8" class="form-control outtext" readonly></textarea>

我在控制台中遇到错误。它说$不是一个函数。请帮我解决这个问题。

Answer 1

请在 HTML 渲染期间包含此行

function GetURLParams() {
    var url = window.location.href;
    var regex = /[?&]([^=#]+)=([^&#]*)/g,
        params = {},
        match;
    while (match = regex.exec(url)) {
        params[match[1]] = match[2];
    }
    return params;
}
var gcd2 = function(a, b, f) {
    if( f )
    {
        if ( b<=1 )
            return a;
    }
    else
    {
        if ( !b )
            return a;
    }
    return gcd2(b, a % b, f);
};
$( document ).ready(function() {
     var params = GetURLParams();
    if (Object.keys(params).length > 0 && params.x != "") {
        document.getElementById("x").value = params.x;
    }
});   

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<input type="text" id="x" name="x" class="intext form-control" tabindex="1">
<button type="button" title="Convert" class="btn btn-lg btn-primary" tabindex="2" onclick="convert()"> Convert</button>
<input class="form-control" type="text" id="y" tabindex="5" readonly>
<input class="form-control" type="text" id="n" tabindex="6" readonly>
<canvas id="frac"></canvas>
<input class="form-control" type="text" id="d" tabindex="7" readonly>
<textarea rows="7" id="area" tabindex="8" class="form-control outtext" readonly></textarea>

一旦你感觉到它固定了，下载JQuery包并保存在你的包中

Answer 2

可能最简单的解决方案使用 Fraction.js：

var f = new Fraction(0.182);
console.log(f.n, f.d); // 91, 500