console.log-寫在位置欄中，而不是在控制台面板中

Question

我有一個標准格式，它從一個文本框<input type="text" ...獲取值<input type="text" ...處理，然后視情況將信息放入div或另一個文本框。

一切都在，直到我弄錯了。 我在文本框周圍添加了<form> ，並且在調用函數時未添加return false 。 花了幾秒鍾來解決問題，但我注意到了一些有趣的事情：console.log信息放置在位置欄中。

function getTotal(){
....
var total=end-start;
....
console.log(total);
}

如預期的那樣（因為不包括return false），沒有將div寫入到文本框，也沒有將文本框寫入到....看屏幕截圖。

這是怎么發生的？ 為什么將其寫入位置欄？

屏幕下方：（我無法為其創建jsfiddle，因為它需要一個表單提交按鈕。）我在<input type="text" id="start">文本框中輸入22，在<input type="text" id="start">中<input type="text" id="end"> 77 <input type="text" id="end">

一切都適用於：

<form>
<input type="text" name="start" id="start"><br/>
<input type="text" name="end" id="end"><br/>
<button onClick="checkTotal(); return false; ">Check Total</button><br/>
<input type="text" id="aaa"><br/>
</form>

刪除return false並將其寫入位置欄：

<form>
<input type="text" name="start" id="start"><br/>
<input type="text" name="end" id="end"><br/>
<button onClick="checkTotal();">Check Total</button><br/>
<input type="text" id="aaa"><br/>
</form>

JavaScript是這樣的（所有內容都已精簡，以便於閱讀）

    function checkTotal(){

    var start=document.getElementById('start').value;
    var end=document.getElementById('end').value;
    var total=end-start;
    var writeTotal=document.getElementById('total');
    writeTotal.innerHTML=total;
    var abc=document.getElementById('aaa').value=total;
    console.log(total);

    }

Answer 1

您所擁有的是帶有隱式GET方法類型的表單。 旨在根據字段名稱將表單值作為URL編碼的參數添加到URL。

因此，您看到的結果與console.log完全無關。