在 onload 事件上使用 Javascript 添加两个数字

问题描述 投票：0回答：3

页面加载时如何从文本框中添加两个数字？仅当我尝试创建用于添加的按钮时它才有效。 

function sum() {
  var txtFirstNumberValue = document.getElementById('totalprice').value;
  var txtSecondNumberValue = document.getElementById('price1').value;
  var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
  if (!isNaN(result)) {
    document.getElementById('totalprices').value = result;
  }
}

javascript php html textbox
3个回答
1
投票

使用window.onload

<script>
  function sum() {
            var txtFirstNumberValue = document.getElementById('totalprice').value;
            var txtSecondNumberValue = document.getElementById('price1').value;
            var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
            if (!isNaN(result)) {
                document.getElementById('totalprices').value = result;
            }
        }
  window.onload=sum;
</script>
1
投票

您需要在文档使用 

window.onload
监听器加载完毕后调用该函数 https://developer.mozilla.org/en/docs/Web/API/GlobalEventHandlers/onload

即

function sum(){
     var txtFirstNumberValue = document.getElementById('totalprice').value;
            var txtSecondNumberValue = document.getElementById('price1').value;
            var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
            if (!isNaN(result)) {
                document.getElementById('totalprices').value = result;
            }
        }
window.onload = sum;

或者，您可以在文档中的 HTML 之后运行代码，而不是在函数中，然后它会立即解释

例如

<html>

<div>some stuff here</div>
... // bottom of document
<script>
var txtFirstNumberValue = document.getElementById('totalprice').value;
                var txtSecondNumberValue = document.getElementById('price1').value;
                var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
                if (!isNaN(result)) {
                    document.getElementById('totalprices').value = result;
                }
</script>
</html>
1
投票

如果您更喜欢 jQuery 而不是常规 Javascript：

$(document).ready(function() {
    var txtFirstNumberValue = $('#totalprice').val();
    var txtSecondNumberValue = $('#price1').val();
    var result = (parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue));
    if (!isNaN(result)) {
        $('#totalprices').val(result);
    }
});

这也会比 

window.onload
更快触发，从而带来更好的用户体验。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.