在没有jQuery的情况下获取文本字段的当前值

时间:2014-05-02 15:55:35

标签: javascript html onclick event-listener

所以我一直在尝试使用onclick事件获取输入的当前值。我相信这个问题喜欢我将一个函数绑定到页面加载的按钮,所以它只接受字段的默认值。有没有办法使用非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;
}

1 个答案:

答案 0 :(得分: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); });
}