Question

取三个文本字段。

1）字段1 - 允许任何特殊字符以字母开头和结尾但允许中间的数字，彗差和小数： $ 123456.00X

2）与第1栏相同

3）与第1栏相同

4）当您在字段下方的字段1中键入显示模式时显示每个数字

5）计算按钮应计算为字段1值乘以字段2

值和由字段3决定的值。计算句柄非数值时，删除显示的非数字并显示结果。

   div id="divMyTestPage" class="col-xs-12">
  <h1 class="mt5 mb10 main-title card"><i class="fa fa-caret-down mr5"> 
  </i>Client Side Page:<span class="ml10"><span class="text-bold ml10"> 
  </span><span id="spnMessage" class="pull-right" style="color: green"> 
  </span></span><span class="pull-right ml5 mt-1 wf-status"></span></h1>
   <div class="col-xs-4">
    <form>
        <input type="text" id="firstNumber" placeholder="Enter Here" 
  class="mb5" onchange="inputFunction()" /><br>
        <span id="firstDemo"></span><br />
        <input type="text" id="secondNumber" placeholder="Enter Here" 
   class="mb5" onchange="inputFunction()" /><br>
        <span id="secondDemo"></span><br />
        <input type="text" id="thirdNumber" placeholder="Enter Here" 
  class="mb5" onchange="inputFunction()" /><br>
        <span id="thirdDemo"></span><br />
        <br />
        <input type="button" onclick="multiplyNumbers()" class="mb10" 
  Value="Calculate" />
        <div>
            The Calculation is : <br>
            <span id="calculate"></span>
        </div>
    </form>
 </div>
 </div>
 <script type="text/javascript">
 function inputFunction() {
    var x = document.getElementById("firstNumber").value;
    var fn = parseFloat(x);
    document.getElementById("firstDemo").innerHTML = fn;
    var y = document.getElementById("secondNumber").value;
    var sn = parseFloat(y);
    document.getElementById("secondDemo").innerHTML = sn;
    var z = document.getElementById("thirdNumber").value;
    var tn = parseFloat(z);
    document.getElementById("thirdDemo").innerHTML = tn;

 };
function multiplyNumbers() {
    num1 = document.getElementById("firstDemo").innerHTML;
    num2 = document.getElementById("secondDemo").innerHTML;
    num3 = document.getElementById("thirdDemo").innerHTML;
    document.getElementById("calculate").innerHTML = (num1 * num2) / num3;
 };
 </script>

这是我的代码，我用简单的javascript编写。

Answer 1

如果你担心它的提取，那么你就是这样做的。

var x = document.getElementById("firstNumber").value; // "$123456.00X"
var y = x.substring(1, x.length - 1); // "123456.00"
var myFloatNum = parseFloat(y); // 123456.00

编辑1：

var x = document.getElementById("firstNumber").value; // "$1c2,34.00NM"
var y = x.split(""); // ["$", "1", "c", "2", ",", "3", "4", ".", "0", "0", "N", "M"]
var tempArr= [];
y.forEach((n) => {
  var t = parseInt(n);
  if(!isNaN(t)) { // if t is a number, push it to tempArr
    tempArr.push(t);
  }
});
var myNum = tempArr.join("");

Answer 2

这将帮助您使用本机javascript从任何字母数字字符串中提取有效数字。

转换字符数组中的字符串。
检查每个字符数组是否为有效数字。
（可选）如果字符串中有多个小数（特殊字符），则应删除最后一个小数，并删除所有其他小数。

你可以找到工作小提琴https://jsfiddle.net/vibs2006/oaqnkv5a/

＆＃13;

    var validNumber = '';
    var inputString = "$1c2,34.00NM";

    function calculateString(inputString) {        
        //Convert String to Character array using Javascript's string split function (actually workaround as Array.From method is not supported in IE 11 and below)
        var charArray = inputString.split("");
        document.getElementById("info").innerHTML = 'Total Characters in input string are ';
        document.getElementById("divOutput").innerHTML = "";
        validNumber = '';
        
        //Now Looping through each string (character in this case) by using Array object's forEach function
        charArray.forEach(function (char) {
            document.getElementById("info").innerHTML = document.getElementById("info").innerHTML + "[" + char + "] ";
            
            //Testing if Number is a valid number
            if (!isNaN(char)) {
                validNumber = validNumber.concat(char);
            }

            //Testing for a presence of Decimal. 
            //Please note that for removing multiple validations you need to write more detailed code.
            if (char.indexOf(".") != -1) {
                validNumber = validNumber.concat(char);
            }                 
        });
        
        document.getElementById("divOutput").innerHTML = "String without any special character is '" + validNumber + "'";
    }

    //Executing the function
    calculateString(inputString);       

    //Adding Event Handler for change in text via tab or keypress events
    var inputTxtField = document.getElementById("txtInputOriginalString");
    inputTxtField.addEventListener("change", function (e) {        
        calculateString(inputTxtField.value)
    });

        inputTxtField.addEventListener("keyup", function (e) {            
        calculateString(inputTxtField.value)
    });

＆＃13;

<label>Original String:
        <input type="text" id="txtInputOriginalString" value="$1c2,34.00NM" />
    </label>
    </p>
    <div id="info"></div>
    </p>
    <div id="divOutput"></div>
    </p>

＆＃13;

如何使用javascript或jQuery从字符串中提取数字而不使用正则表达式

2 个答案: