从文本字段捕获值，然后使用Jquery与单选按钮值匹配

Question

你好每个人我遇到了一个问题我有两个文本框（长度*宽度）如屏幕截图所示我们有两个捕获输入值然后我们有两个匹配维度最近的值

示例

让我们说在这种情况下我们输入了71和29首先我们必须检查71的最近值，所以71的最近值是72（72 * 30,72 * 36），现在我们必须匹配第二个值29所以最接近的值是30然后我们的输出是72 * 30

JS

document.getElementById("tmcp_textfield_7").addEventListener("blur", getValue);
document.getElementById("tmcp_textfield_8").addEventListener("blur", getValue);
function getValue() {
var entered = document.getElementById('tmcp_textfield_7');
var entered1 = document.getElementById('tmcp_textfield_8');
    alert(entered.value);
    alert(entered1.value);
}

HTML

   <li class="tmcp-field-wrap_tmcp_textfield_7">
    <label for="tmcp_textfield_7"></label>
      <input placeholder="Length" minlength="2" maxlength="4" class="tmcp-field dimension-layer-entersize1 tm-epo-field tmcp-textfield tm-valid" name="tmcp_textfield_5" type="number">

 </li>
     <li class="tmcp-field-wrap_tmcp_textfield_8">
    <label for="tmcp_textfield_8"></label>
      <input placeholder="Breadth" minlength="2" maxlength="4" class="tmcp-field dimension-layer-entersize2 tm-epo-field tmcp-textfield tm-valid" name="tmcp_textfield_6" type="number" >

 </li>

Answer 1

您在id输入中遗漏了属性text，因此请给他们这样的ID：

<input id="tmcp_textfield_7" ...

<input id="tmcp_textfield_8" ....

并插入如下的jquery代码：

＆＃13;

＆＃13;

$(document).ready(function() {
    
    $("#tmcp_textfield_7 ").on("blur",function(){
        
        var value = $(this).val();
        alert(value);
        
    })
    $("#tmcp_textfield_8").on("blur",function(){
        
         var value = $(this).val();
         alert(value);
        
    })
    
    
})

＆＃13;

   <li class="tmcp-field-wrap_tmcp_textfield_7">
    <label for="tmcp_textfield_7"></label>
      <input id="tmcp_textfield_7" placeholder="Length" minlength="2" maxlength="4" class="tmcp-field dimension-layer-entersize1 tm-epo-field tmcp-textfield tm-valid" name="tmcp_textfield_5" type="number">

 </li>
     <li class="tmcp-field-wrap_tmcp_textfield_8">
    <label for="tmcp_textfield_8"></label>
      <input id="tmcp_textfield_8" placeholder="Breadth" minlength="2" maxlength="4" class="tmcp-field dimension-layer-entersize2 tm-epo-field tmcp-textfield tm-valid" name="tmcp_textfield_6" type="number" >

 </li>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

＆＃13;

＆＃13;

＆＃13;