jQuery Mobile的返回NaN

Question

所以我想

$(function() { 
 
    convertPrice = function() { 
 
    var myAnswer, myVal, myRate; 
 
    myVal = $('#slider1').val(); 
 
    myRate = $('#rate').val(); 
 
    myVal = parseFloat(myVal); // convert string type 
 
    myAnswer = myVal * myRate; 
 
    $('#Answer').val(myAnswer); 
 

 
    } 
 

 
    $("#convertButton").click(convertPrice); 
 
});

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

 
<div data-role="fieldcontain"> 
 

 
    <label for="R">Cost Per Person:</label> 
 
    <input type="text" value="$990" name="rate" id="rate" readonly /> 
 
</div> 
 
<label for="slider">Number of People Going?:</label> 
 
<input type="range" name="slider" id="slider1" value="1" min="1" max="30" /> 
 
</div> 
 
<input type="button" value="Convert" id="convertButton" /> 
 

 
<div data-role="fieldcontain"> 
 
    <label for="theAnswer">Results:</label> 
 
    <input type="text" name="textInput" id="Answer" value="" readonly /> 
 
</div>

所以，当我按一下按钮，它只是返回的喃？有什么建议么？

Answer 1

对于费率输入框，您已指定$ in value标记。所以它给了NaN的价值。该行代码更改为

$

然后，它会肯定

Answer 2

使用本作品，但要好得多删除 “$”

$(function() { 
 
    convertPrice = function() { 
 
    var myAnswer, myVal, myRate; 
 
    myVal = $('#slider1').val(); 
 
    myRate = $('#rate').val(); 
 
    myRate = myRate.replace("$",""); 
 
    myVal = parseFloat(myVal); // convert string type 
 
    myAnswer = myVal * myRate; 
 
    $('#Answer').val(myAnswer); 
 

 
    } 
 

 
    $("#convertButton").click(convertPrice); 
 
});

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

 
<div data-role="fieldcontain"> 
 

 
    <label for="R">Cost Per Person:</label> 
 
    <input type="text" value="$990" name="rate" id="rate" readonly /> 
 
</div> 
 
<label for="slider">Number of People Going?:</label> 
 
<input type="range" name="slider" id="slider1" value="1" min="1" max="30" /> 
 
</div> 
 
<input type="button" value="Convert" id="convertButton" /> 
 

 
<div data-role="fieldcontain"> 
 
    <label for="theAnswer">Results:</label> 
 
    <input type="text" name="textInput" id="Answer" value="" readonly /> 
 
</div>

Answer 3

由于在前面的回答中提到$符号是问题。你可以删除$符号它将起作用。如果你想保留这个符号，那么usi ng regex您可以在计算时删除该标志

var myAnswer, myVal, myRate; 
myVal = $('#slider1').val(); 
myRate = $('#rate').val(); 
myVal = parseFloat(myVal); // convert string type 
myRate = parseFloat(myRate.replace(/[^0-9\.-]+/g, "")); // here before convserting we need to use regex to replace $ with "" 
myAnswer = myVal * myRate; 
$('#Answer').val(myAnswer);