如何将字符串更改为表单中的数字? (继续把它变成字符串)

时间:2017-10-23 03:54:11

标签: javascript

我对为什么我的javascript没有把我的字符串变成数字感到困惑。

            <div class="form-group">
                <h3>Question #1</h3>
                <label for="exampleSelect1">Question?</label>
                <select class="form-control" id="q1">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                </select>
            </div>

JavaScript:

$("#submitBtn").on("click", function(){
  event.preventDefault();
    var q1 = $("#q1").val().trim();
    var q2 = $("#q2").val().trim();
    var q3 = $("#q3").val().trim();
    var q4 = $("#q4").val().trim();
    var q5 = $("#q5").val().trim();
    var q6 = $("#q6").val().trim();
    var q7 = $("#q7").val().trim();
    var q8 = $("#q8").val().trim();
    var q9 = $("#q9").val().trim();
    var q10 = $("#q10").val().trim();

  var newFriend = {
    name: $("#inputName").val().trim(),
    photo: $("#inputPic").val().trim(),
    scores: [
    parseFloat(q1),
    parseFloat(q2),
    parseFloat(q3),
    parseFloat(q4),
    parseFloat(q5),
    parseFloat(q6),
    parseFloat(q7),
    parseFloat(q8),
    parseFloat(q9),
    parseFloat(q10),

    ]
  };

当我在console.log(newFriend)时,它会不断将分数转换成字符串。我已经尝试过Number(),parseInt(),但它仍然不起作用。

2 个答案:

答案 0 :(得分:0)

您也可以使用parseInt并传递基数。另外,一元运算符也可用于将字符串转换为数字。

注意选项中没有值属性。

$("#submitBtn").on("click", function() {
  event.preventDefault();
  var q1 = parseInt($("#q1").val().trim(), 10)
  console.log(typeof q1)

})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
  <h3>Question #1</h3>
  <label for="exampleSelect1">Question?</label>
  <select class="form-control" id="q1">
                    <option value = "1" >1</option>
                    <option value = "2">2</option>
                    <option value = "3">3</option>
                    <option value = "4">4</option>
                    <option value = "4">5</option>
                </select>
</div>
<button type="submit" id="submitBtn">Submit</button>

答案 1 :(得分:0)

您的代码按原样运行。

但是,根据您所做的一些评论,似乎此代码在服务器上而不是在客户端中运行,因此通过HTTP发送,其中所有内容都是字符串。您真的应该编辑您的问题,以完整地解释代码运行的环境。

您可以在下面看到代码的精简版本,并且您将看到数据在数组中是数字的。我刚刚将触发代码的事件更改为change的{​​{1}}事件。

最后,您无需在select值上调用.trim(),因为您在select元素中不包含任何空格。只要有用户输入,就应该使用option

&#13;
&#13;
trim()
&#13;
$("#q1").on("change", function(){
    var q1 = $("#q1").val().trim();


  var newFriend = {
    scores: [
      parseFloat(q1),

    ]
  };
  
  console.log(newFriend.scores[0], typeof newFriend.scores[0]);
   
});
&#13;
&#13;
&#13;