javascript - 不使用 jQuery 获取文本字段的当前值

Question

所以我一直在尝试使用 onclick 事件获取输入的当前值。我相信这个问题就像我在页面加载时将函数绑定(bind)到按钮一样，因此它只接受字段的默认值。有没有办法使用非 jQuery 方法解决这个问题。

主 html 文件中的代码。

<div style="height:50px;">
  <h3 style="width:50%;float:left;">Please enter an ordered set of numbers separated by commas</h3>
  <input style="float:right;" id="numbers" type="text" value="1,2,3,4,5,6,7,8,9,10">
</div>
<div style="height:50px;">
   <input  style="float:right;" id="findMe" type="text" value="1">
   <h3>number to find</h3>
</div>
<button id="runSearch">Index of</button>the index is: <span id="indexOf"></span>

<script>
document.getElementById("runSearch").addEventListener('click',function() {findIndex()});
</script>

单独的JS文件代码。

function binarySearch(array, left, right, findMe, index){


    if (findMe <0 || findMe === NaN || left > right){
        console.log("not a number among other issues");
        return -1;
    }

    var middle = Math.round((right-left) /2) ;
    console.log(middle);

    if (array[middle] === findMe) {
        console.log("found it")
        return middle;
    }

    else if (findMe < array[middle]) {
        console.log("it's smaller");
        return binarySearch(array,left,middle-1,findMe, middle);
    }
    else if (findMe > array[middle]){
        console.log("is bigger");
        return binarySearch(array,middle+1,right,findMe, middle);
    }
    else {
        console.log("something else");
        return -1;
    }
}


//splits a CSV into an array of numbers
function numbersIntoArray(numbers){

    return numbers.split(",");

}

function findIndex(){
    var numbers = document.getElementById("numbers").value;
    var findMe = document.getElementById("findMe").value;
    var array = numbersIntoArray(numbers);
    var index = binarySearch(array,0,array.length-1,2);
    console.log("the index is:" + index);
    document.getElementById("indexOf").innerHTML =index;
}

Answer 1

问题是值是字符串，而不是数字，尝试使用 parseInt 将每个字符串转换为数字:

var findMe = parseInt(document.getElementById("findMe").value);

对于您的数字数组也类似:

function numbersIntoArray(numbers){
    var realNumbers = [];
    numbers.split(",").forEach(function (n) { realNumbers.push(parseInt(n)); });
    return realNumbers
}

或者，如果您愿意，可以使用 .map:

function numbersIntoArray(numbers) {
    return numbers.split(",").map(function (n) { return parseInt(n); });
}